/* WEB SMART COLORS FOR TEXT 
 color:#007700 --the lighter green text
 color: #004400 --the darker green text
 008888 --the teal
 66bbaa  --the teal in nav bars
 ffff66  --the yellow in nav bars
*/

/* 
for resources: use bigstory as template
*/
 
p.hang {margin-left: 10px; text-indent: -10px;}
p.quote {margin-left: 30px;}

 
body {  background-color:#FFEEAA;; 
margin:0; padding: 0; border: 0px; }


#hometext { position:relative; display:block; max-width:700px;  padding:120px 0 70px 0; font-family:verdana, helvetica, sans-serif!important; font-size:28px; color:#007700; text-align:left; font-weight:normal; letter-spacing:-1px; } 
#hometext b { font-weight:normal; font-size:30px; color: #004400; }
#hometext a { color: #004400; font-size:30px; text-decoration: none; }
#hometext a:hover { color: #008888; text-decoration: none; } 

#listtext { position:relative; display:block; max-width:70%;  padding:120px 0 70px 0; font-family:verdana, helvetica, sans-serif!important; font-size:18px; color:#007700; text-align:left; font-weight:normal; letter-spacing:-1px; } 
#listtext b { font-weight:normal; font-size:24px; color: #004400; }
#listtext a:hover { color: #008888; font-size:20px; text-decoration: none; } 
#listtext a { color: #004400; font-size:20px; text-decoration: none; }

#arttext { position:relative; display:block; font-family:arial, helvetica, sans-serif!important; font-size:16px; 
line-height: 120%; background-color: #FFF9D1; color:#004400; text-align:left; font-weight:normal; width: 800px; margin-top: 0px; padding: 100px 45px 45px 45px /* top left  bottom */; border: 0px; } 
#arttext b { font-weight:normal; font-size:110%; color: #007700; }
#arttext a:hover { color: #004400;  text-decoration: none; } 
#arttext a { color: #008888;  text-decoration: none; }

#humortext { position:relative; display:block; font-family: Comic Sans MS; font-size: 16px; 
line-height: 1.2; background-color: #ffffe8; color:#000000; text-align:left; font-weight:normal; width: 85%; margin-top: 40px; padding: 50px 25px 25px 25px /* top left  bottom */; border: 0px; } 
#humortext b { font-weight:normal; font-size:20px; }
#humortext a:hover { font-family: Arial, Helvetica, sans-serif; color:#008080; font-size:12px; text-decoration: none; } 
#humortext a { font-family: Arial, Helvetica, sans-serif; color:#990033; font-size:12px; text-decoration: none;  }

#booktext { position:relative; display:block; font-family:verdana, helvetica, sans-serif; font-size: 16px; 
line-height: 1.2; background-color: #ffffe8; color:#000000; text-align:left; font-weight:normal; width: 740px; margin-top: 40px; padding: 50px 25px 25px 25px /* top left  bottom */; border: 0px; } 
#booktext b { font-family:verdana, helvetica, sans-serif; font-weight:normal; font-size:20px; }
#booktext a:hover { font-family: Arial, Helvetica, sans-serif; color:#008080; font-size:18px; text-decoration: none; } 
#booktext a { font-family: Arial, Helvetica, sans-serif; color:#990033; font-size:18px; text-decoration: none;  }


.credit {
     font-family: verdana, Helvetica, sans-serif;
     font-size: 70%;
	 line-height: 1;
     color: #007700;
     margin-top: 2px;
     margin-right: 5px;
     margin-left: 5px;
}

.box {
     font-family: Arial, Helvetica, sans-serif;
     font-size: 90%;
     text-align: left;
     float: right;
	 /* width: 740px; */ 
	 /* how to put width into html doc: <span class="box-tools" style="width: 740px;"> */
	 border:solid 1pt #A9A284;
     padding: 10px;
	 margin: 4px;
     line-height: 1.1;
     background-color: #F9F2C7;
}


#topbar { position:fixed!important; position:absolute; top:0; left:0; background-color:#004400; width:100%; height:32px; text-align:right; font-family:arial, helvetica, sans-serif!important; font-size:14px; }

#botbar { position:fixed!important; position:relative; clear:both; bottom:0; left:0; background-color:#004400;  width:100%; height:65px; text-align:right; font-family:arial, helvetica, sans-serif!important; font-size:14px; }

#topnav { position:fixed!important; position:absolute; display:block; top:0; right:5px; margin:0; padding:5px 10px; z-index:1; }
#topnav li { display:inline; list-style:none; margin-right:1px; padding:7px; }
#topnav li, #topnav li a  { color:#66bbaa; text-decoration:none;  }
#topnav li a:hover, #topnav li a.active { color:#ffff66; }

#botnav { position:fixed!important; position:relative; clear:both; display:inline; bottom:20px; right:5px; margin:0; padding:5px 10px; z-index:1;  }
#botnav li { display:inline; list-style:none; margin-right:1px; padding:7px; }
#botnav li { color:#ffff66; }
#botnav li a  { color:#66bbaa; text-decoration:none; }
#botnav li a:hover, #botnav li a.active { color:#ffff66; }