/*
''<summary>
		<page>04tabs.css</page>
		<description>All tab styles to be built here</description>
		<notes>
			Backgrounds are pre-loaded in most browsers
			Use <spans> instead of <divs> for validation reasons
		</notes>
		<version>2006/07/05: Gregory Brine		Initial creation of file</version>
''</summary>
*/
ul.tabs {
	float: left; margin: 0 !important;  padding: 0 !important; width: 100%;
	background: url(../images/tabs/tabs_line.gif); background-repeat: repeat-x; background-position: bottom left; 
}
ul.tabs li { display: inline; float: left; margin: 0 1px 0 0; }
ul.tabs li.last { margin: 0; }

/* Preload the images. An <li> with the preload class will not show in most browsers */
ul.tabs li.preload { padding: 0; margin: 0; position: absolute; top: -1000px; left: -1000px; background-image: url(../images/tabs/tab_generic_left_on.gif); }
ul.tabs li.preload span { padding: 0; margin: 0; background-image: url(images/tabs/tab_generic_right_on.gif); }
ul.tabs li.preload span span { padding: 0; margin: 0; background-image: url(images/tabs/tab_generic_center_on.gif); }

/* The tab styles OFF */
ul.tabs li a:link, ul.tabs li a:visited {
	float: left; display: block; color: #000000; padding: 0 0 0 10px; border-bottom: 1px solid #000000; text-align: center; text-decoration: none;
	background-color: inherit; background-image: url(../images/tabs/tab_generic_left.gif); background-position: top left; background-repeat: no-repeat;
}
ul.tabs li a span {
	display: block;
	padding: 0 10px 0 0;
	background-image: url(../images/tabs/tab_generic_right.gif); 
	background-position: top right;
	background-repeat: no-repeat;
}
ul.tabs li a span span {
	display: block;
	padding: 5px 0 5px 0;
	background-image: url(../images/tabs/tab_generic_centre.gif); 
	background-position: top left;
	background-repeat: repeat-x;
}

/* The tab styles HOVER state */
ul.tabs li a:hover, ul.tabs li a:focus { color: #ffffff; background-color: inherit; background-image: url(../images/tabs/tab_generic_left_on.gif); }
ul.tabs li a:hover span, ul.tabs li a:focus span { background-image: url(../images/tabs/tab_generic_right_on.gif); }
ul.tabs li a:hover span span, ul.tabs li a:focus span span { background-image: url(../images/tabs/tab_generic_centre_on.gif); }

/* The tabs styles ON state */
ul.tabs li a.on, ul.tabs li a.on:visited, ul.tabs li a.on:hover, ul.tabs li a.on:focus {
	border: 0; font-weight: bold; color: #000000; background-color: inherit;
	background-image: url(../images/tabs/tab_generic_left.gif);
}
ul.tabs li a.on:link span, ul.tabs li a.on:visited span, ul.tabs li a.on:hover span, ul.tabs li a.on:focus span { background-image: url(../images/tabs/tab_generic_right.gif); }
ul.tabs li a.on:link span span, ul.tabs li a.on:visited span span, ul.tabs li a.on:hover span span, ul.tabs li a.on:focus span span {
	padding: 5px 0 6px 0; background-image: url(../images/tabs/tab_generic_centre.gif);
}


/* Example spans */
div.tabbeddiv { border-left: 1px solid #000000; border-bottom: 1px solid #000000; border-right: 1px solid #000000; height: 300px; padding: 10px; }