Validation errors in CSS and XHTML

[harambeegirl]

My site is at www.anansisweb.comI am validating my CSS at the W3C Validator. It suggests that I choose a generic font family as a last alternative. My page is written in an unusual font called African. I suppose that the validator wants me to choose a font in case some browsers can't read my font (although I have tested it in all the browsers and it does show up). How do I use CSS to choose an "alternative" font? I wrote a second line of code for Arial below the original font, but then all my fonts turned to Arial. I don't want the fonts to be written in Arial if African shows up just fine.The CSS validator is also saying that I need a background color for my headings and my paragraphs. I don't want any color, so I set it to transparent, but it is still giving me friendly "suggestions."Finally, the XHTML validator is telling me that it doesn't like the javascript in my widgets. I don't know what to do about this because I didn't create the widgets -- I just copied and pasted them. Do I ignore these warnings and the failed validation report or is there some way to adjust the code? I am using the beta version of Microsoft EWD (Expression Web Developer), if that helps.Here is my CSS:

/* CSS layout */body {	margin: 0;	padding: 0;	border: 0;	background-position: center center;	background-image: url('../images/spiderback6.jpg');	background-repeat: repeat;	background-attachment: scroll;	font-family: African;}/* Site Typography */h1, h2, h3 {	font-family: African;	margin-bottom: 10px;	font-weight: lighter;	text-align: center;}h1 {	color: black;	background-color: transparent;	font-size: x-large;	letter-spacing: 1px;	z-index: 2;}h3.h3red {	color: red;	background-color: transparent;	font-size: large;	letter-spacing: 2px;	padding: 3px;	line-height: 14pt;	z-index: 2;	background-image:url('../images/spiderback11.gif')}h3.h3green {	color: #00CC00;	background-color: transparent;	font-size: large;	letter-spacing: 2px;	padding: 3px;	line-height: 14pt;	z-index: 2;	background-image:url('../images/spiderback11.gif')}p {	font-size: small;	background-color: transparent;	line-height: 14pt;	font-weight: lighter;	color: black; 	font-family: African;}/* Links */a:link {	color: blue;	background-color: transparent;	font-weight: lighter;	text-decoration: underline; 	line-height: 14pt;	font-size: small;}a:visited {	color: red;	background-color: transparent;	font-weight: lighter;	text-decoration: underline; 	line-height: 14pt;	font-size: small;}a:hover {	text-decoration: underline; 	color: maroon;	font-size: small;}a:active {	color: blue;	background-color: transparent;	font-weight: lighter;	text-decoration: none;	line-height: 14pt;	font-size: small;}/* Site Divisions */#masthead {	position: relative; top: 0px; margin-left: 60px;	white-space: normal;	vertical-align: middle;	height: 125px;	width: 800px;	overflow: hidden;	padding: 20px;	border: 0px;	text-align: center;	font-family: African;	font-style: normal;	text-indent: 0px;	letter-spacing: 1.75px;	background-position: center center;	background-repeat: repeat;	background-image: url('../images/spiderback11.gif')}#navmenu {	position: relative; top: 0px; margin-left: 60px;	text-align: center;	height: 70px;	width: 832px;	vertical-align: middle;	overflow: hidden;	padding: 5px 0px;	border: solid medium; 	border-color: red #00CC00;	background-image: url('../images/spiderback11.gif');}#container {	position: relative; top: 0px; margin-left: 60px;	vertical-align: middle;	float: none;	padding: 15px;	width: 810px;	height: 400px;		border: 0px;	background-image: url('../images/spiderback11.gif');	background-color: transparent;}#maincontent.shortwidth {	overflow: scroll;	vertical-align: middle;	position: relative;	float: left;	width: 450px;	height: 380px;	background: #ffffff;	border: 0px;	padding: 10px;}#maincontent.longwidth {	overflow: scroll;	vertical-align: middle;	position: relative;	float: left;	width: 800px;	height: 380px;	background: #ffffff;	border: 0px;	padding: 10px 0px;}#rightsidebar {	overflow: scroll; 	vertical-align: middle;	position: relative;	float: right;	width: 300px;	height: 380px;	background: #ffffff;	padding: 10px;	border: 0px;}#footer {	position: relative; top: 0px; margin-left: 60px;	overflow: auto;	vertical-align: bottom;	text-align: center;	width: 580px;	height: 95px;	padding: 10px 130px;	border: 0px;	background-image: url('../images/spiderback11.gif');}/* Images */img.hspace1 {	padding: 0px 30px;	border: 0px;	margin: 7.5px 0px;}img.hspace2 {	margin: 0px 10px;	border: solid 2px; 	border-color: #00CC00;}img.Gye{	position: absolute;	left: 80px;	top: 10px;	z-index: 1;}img.YeOhene{	position: absolute;	left: 255px;	top: 10px;	z-index: 1;}img.Nti{	position: absolute;	left: 440px;	top: 10px;	z-index: 1;}img.Ananse{	position: absolute;	left: 635px;	top: 10px;	z-index: 1;}/* Miscellaneous */ul {	font-size: small;	font-family: African;	font-weight: lighter;	line-height: 12pt;}

[Moridin]

How to give a generic font-family:

font-family: African, Arial, Trebuchet MS, Sans-Serif, Georgia, Courier;

Set the background color for the headings to the same color as the background color for that section.- Moridin