@charset "UTF-8";
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #90986B;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #CBCFB3;
}
#container {
	width: 780px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #97233F;
	margin: 0 auto;
	text-align: left;
	border-right: 1px solid #333;
	border-left: 1px solid #333;
} 
#header
 {
 	padding: 0;
 	/* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
 	background-color: #FFF;
 	background-image: url(images/iStock_000001841362XSmall%2520choc%2520lab%2520face.jpg);
 	background-repeat: no-repeat;
 	background-position: right top;
} 
#header2
{
	padding: 0;
	/* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	background-color: #FFF;
	background-image: url(images/iStock_000002457592XSmall%2520black%2520lab.jpg);
	background-repeat: no-repeat;
	background-position: right top;
} 
#header3
{
	padding: 0;
	/* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	background-color: #FFF;
	background-image: url(images/iStock_000003203577XSmall%2520yellow%2520cat.jpg);
	background-repeat: no-repeat;
	background-position: right top;
} 
#header4
{
	padding: 0;
	/* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	background-color: #FFF;
	background-image: url(images/iStock_000003412006XSmall%2520boxer%2520with%2520stethascope.jpg);
	background-repeat: no-repeat;
	background-position: right top;
} 
#header5
{
	padding: 0;
	/* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	background-color: #FFF;
	background-image: url(images/iStock_000004127205XSmall%2520standing%2520yorkie.jpg);
	background-repeat: no-repeat;
	background-position: right top;
} 
#header img, #header2 img, #header3 img, #header4 img, #header5 img, #header6 img {border: none;} 
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 0px; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
#sidebar1 {
	float: left; /* since this element is floated, a width must be given */
	width: 220px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 15px 10px;
}
.pod {
	background: #CBCFB3 url(images/bottom_pod2.gif) no-repeat left bottom;
	width: 220px;
	padding: 0 0 20px;
}
.pod dt
{
	background: url(images/top_pod2.gif) no-repeat;
	padding: 20px 20px 0;
	font-size: 110%;
	color: #97233F;
	margin: 0;
	font-weight: bold;
}
.pod dd {
	padding: 10px 20px 0;
	color: #9A515E;
	margin: 0;
	font-size: 80%;
}
.pod a {
	color: #9A515E;
}
.pod ul {
	color: #9A515E;
	margin-left: -20px;
}
#mainContent {
	margin: 0; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 20px 20px 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	float: left;
	width: 480px;
} 
#mainContentFull {
	margin: 0; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 20px 20px 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	float: left;
	width: 730px;
} 
#mainContent h1, #mainContentFull h1 {
	font-size: 1.3em;
	font-weight: bold;
	color: #CBCFB3;
	margin: 0px;
	padding: 0px;
}
#mainContent h2, #mainContentFull h2 {
	color: #CBCFB3;
	font-size: 1.2em;
	font-weight: bold;
}
#mainContent h3, #mainContentFull h3 {
	color: #CBCFB3;
	font-size: 1em;
	font-weight: bold;
}
#mainContent p, #mainContentFull p {
	font-size: 85%;
	line-height: 1.4;
}
#mainContent li, #mainContentFull li {
	font-size: 100%;
	line-height: 1.4;
}
#mainContent a:link, #mainContentFull a:link
{
	color: #90986B;
	text-decoration: underline;
}

#mainContent a:visited, #mainContentFull a:visited
{
	color: #90986B;
	text-decoration: underline;
}

#mainContent a:hover, a:active, #mainContentFull a:hover, a:active
{
	color: #90986B;
	text-decoration: none;
}
#footer {
	padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:#00477F;
} 
#footer p {
 	margin: 0;
 	/* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
 	padding: 10px 0;
 	/* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
 	font-size: 70%;
 	color: #FFFFFF;
 	text-align: center;
}
#footer a:link
{
	color: #FFFFFF;
	text-decoration: underline;
}

#footer a:visited
{
	color: #FFFFFF;
	text-decoration: underline;
}

#footer a:hover, a:active
{
	color: #FFFFFF;
	text-decoration: none;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
	border: 1px solid #00477F;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
	border: 1px solid #00477F;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
blockquote
{
	color: white;
	font-size: .85em;
	font-style: italic;
	padding: 10px;
	background-color: #9A515E;
	border: 1px solid #00477F;
}
.breadcrumb {
 	margin: -10px 0 15px 0;
 	font-size: 70%;
 	color: #90986B;
}


/*XXXXXXXXXXXX Primary top nav rules XXXXXXXXXXX*/

#navbar {
	margin: 0px;
	padding: 0px;
}
.nav {
	border: 1px solid #000; /* borders the top and bottom of the top nav */
	border-width: 1px 0;
	width: 100%;
}

.nav li {list-style: none;} /* removes list bullets */

.button {
	width: 156px;
	float: left;
}

.floatfix {margin-right: -3px;}

.parent {position: relative;}

/*XXXXXXXXXXXX Primary dropdown rules XXXXXXXXXXX*/

.dropdown { /* rules for dropdown div */
	position: absolute;		
	left: -3000px;
	top: auto; /* puts dropdowns directly under top nav */
	width: 250px;
	background: url(images/bgfix.gif);	
}

.dropdown div {
	width: 220px;
	position: absolute;
	left: -3000px;
	top: 0;
	background: url(images/bgfix.gif);
	text-align: left; /* needed because IE misapplies text centering to boxes */
	}

.dropdown ul { 
	width: 189px; /* tweaked so that dropdowns appear to "line up" with top links */
	border: 1px solid #000; 
	border-width: 1px 1px 0;/* borders the sides and top of the dropdowns and flyouts; 
		links provide the bottom border */ 
	margin: 0 30px 30px 30px; /* creates "sticky hovering" zones for dropdowns */
	padding: 0px;
}

.dropdown div ul {margin: 30px 30px 30px 0;} /* creates "sticky hovering" zones for flyouts */

.five .dropdown ul {width: 190px;} /* modifies width for rightmost "visible" dropdown (tweak) */
	
.button:hover div.dropdown {left: -31px;} /* hover rule for dropdowns: the extra pixel makes 
	dropdowns "line up" with top links */ 

/*XXXXXXXXXX Secondary dropdown rules XXXXXXXXXXXX*/

.nav a {
	color: #FFF;
	font-weight: bold;
	font-size: .9em;
	text-decoration: none;
	padding: 6px 0 5px 10px; 
	display: block;
	border-right: 1px solid #000; /* makes the dividers between the top nav links; must be negated 
		for later links */  
} 

.five a {border-right: 0;} /* removes the right border on last top link */

.dropdown li {
	vertical-align: bottom; /* IE5win bugfix */
	position: relative; 
}
			
.parent:hover {background-image: url(images/bgfix.gif);}
/* this hover calls a transparent GIF only to defeat the IE failed hover bug. Any
background change on hovering div.parent will make IE obey and display the dropdown.
While the call itself will fix the bug, make sure you actually call a real image
file so that your site error logs will not fill with failed image calls. */

.parent:hover div.dropdown {left: -21px;} /* hover rule for dropdowns */
/* extra pixel makes dropdowns "line up" with top links */

.dropdown li:hover {background: #9A515E;} /* hover color effect on dropdown links */

.nav div div a {
	color: #fff;
	border-right: 0; /* negates right border for dropdowns */
	border-bottom: 1px solid #000;  /* borders the bottoms of the dropdowns */
}

/*XXXXXXXXXX Primary flyout rules XXXXXXXXXXXX*/

.flyout, 
.mini-zone {
	width: 220px;
	position: absolute;		
	left: -3000px;
	top: -26px; /* this value controls the amount of flyout vertical offset */
	background-image: url(images/bgfix.gif);
	text-align: left; /* needed because IE misapplies text centering to boxes */
}

/* The margins on the UL's replace the div paddings to create "sticky hovering"
zones,  and the margins should "fill" the divs, making the IE background fix 
unnecessary. Unfortunately the background fix is still needed, although this method 
does eliminate possible box model problems */

.flyout ul {margin: 30px 30px 30px 0;} /* creates "sticky hovering" above, below, and to the 
	right of the flyouts */
	
.dropdown li:hover .flyout
{
	left: 180px;
	top: -26px;
} /* this value controls the amount of flyout "overlap" */

.five .flyout ul {margin: 30px 0 30px 30px;} /* rule reversal for "visible" right drop flyouts */

.five li:hover .flyout {left: -210px;} /* reversed flyout rules for rightmost drop flyouts */

/*XXXXXXXXXX z-index rules for top-level menu XXXXXXXXXXX*/

.one {z-index: 10;}
.two {z-index: 20;}
.three {z-index: 30;}
.four {z-index: 40;}
.five {z-index: 50;}
.five:hover {z-index: 25;}
/* this last is a special trick that reverses the stacking order of the rightmost
top link when it or its children are hovered. This, and the previous rules work
together so that when a user is on the top link of any flyout, they can move 
vertically to the top link directly above and not have the sticky hovering zone
on the flyout get in the way of hovering that top link. */

/*XXXXXXXXXX .mini-zone rules XXXXXXXXXXXX*/
			
.mini-zone { /* special hover zone that covers the "danger corner" */
	position: absolute;		
	left: -3000px;
	bottom: -15px;
	top: auto;
	padding: 0;
	width: 15px;
	height: 15px;  
	font-size: 1px;
	background: url(images/bgfix.gif);
}

.dropdown li:hover .mini-zone { /* hover rule for mini-zones */
	left: auto;
	right: 8px;
	top: auto;
}

.five li:hover .mini-zone {left: 8px;} /* reversed hover rule for rightmost drop mini-zones */

/*XXXXXXXXXXX Top nav and dropdown backgrounds XXXXXXXXXX*/

.one, .two, .three, .four, .five {background: #00477F;}
.one ul, .two ul, .three ul, .four ul, .five ul {background: #00477F;}

.flyout li:hover, .button a:hover {background: #9A515E;} /* hover color effect on flyout links */

.flyout ul {background: #3A6FCB;} /* colors background of flyouts */ 

.nav .flyout a {color: #FFF;} /* colors text of flyouts */ 

/*XXXXXXXXXXX Special fixes XXXXXXXXXXX*/

/* This is to hide the following from IE/Mac. \*/
* html .button .dropdown li {
height: 1%;
margin-left: -16px;
mar\gin-left: 0;
}
/* */

* html .nav a
 {height: 1%;}

/* The first 2 rules above fix "bullet region" problems in IE5.x/win,
and the 2nd is to make all links fully clickable. */

.brclear { /* Use a break with this class to clear float containers */
clear:both;
height:0;
margin:0;
font-size: 1px;
line-height: 0;
}

/*\*/ /*/
.nav .dropdown, .nav .dropdown div {width: 189px;}
.nav .button .dropdown ul {margin: 0px;}
.nav .dropdown, .nav .dropdown div {position: static;}
.nav .dropdown ul {border: 0;}
.mini-zone {display: none;}
/* this rule block "dumbs down" the nav for IEmac */

.red
{
	background-color: red;
	color: white;
}