/************************************************************************
TABALICIOUS v1.0.200807311
Create tabbed content in a cinch.

This Javascript, CSS, and HTML for creating HTML tabs in a cinch was designed and written by Eli Szus.
Please credit the author and website when using the script.
http://www.tabalicious.com/
A link to tabalicious.com from the page you use this on would be greatly appreciated.

HIGHLIGHTS:
- Set up tabs on a webpage in moments, by following the simple implementation below.
- Unlimited tabs (up to the window width)
- Tab width is autoset by the width of the tab name
- Tab titles are easily set as the id of the div holding the tab content
- Set the default tab to load by the setting class="init_tab" on the div of your choice
- Send people links straight into a tab by appending the token load_tab to your URL
  - For example: http://www.tabalicious.com/somefolder/pagename.html?load_tab=value
	- the load_tab value can be the name of a tab (using underscores) or the numeric position of the tab
- Since it is built with divs only, you should be able to put any HTML content within the tabs

NOTES:
- It is highly recommended that all style changes are made in the inline styles in the html rather than in the CSS.
- All divs within the to_tab div must have underscores(_) instead of spaces, though they will show as spaces in the visual tabs
  - For example: id="Best_tab_Ever" will show the tab text as "Best tab Ever"
	- When using the load_tab token you must use the case-sensitive underscore version of the name
- The divs tabs_div and to_tab must NOT be changed.

IMPLEMENTATION:
Beginner:
1) Unzip the contents of the version file.
2) Upload the tabalicious folder into the same folder that holds the file you will be adding the tabs to in step 2.
3) Place the html content of tabalicious.htm into the html file of your choice. See tabalicious_sample_html.htm as an example.
4) Add as many divs as you want (or can fit) by adding divs inside of the to_tab div. There should already be 3 divs in there.
5) Add your content inside of these divs.
6) Adjust the inline styles as needed:
(It is recommended that you not adjust the CSS file for your sanity).
- Adjust the total height and width using the height on the tabalicious_container div. The default setting is 70%, but these can be set to 100px or 1000px - whatever floats your boat.
- Move the tabs horizontally by adjusting the left px value in the tabs_div style.

Intermediate:
- If you will be using the tabs on multiple pages on your site, you can place the tabalicious folder at the root level of your site. Then you need to change the JS and CSS sources to reference that directory.

Feel free to email comments and suggestions to tabman @ tabalicious.com!
************************************************************************/

#tabs_div{
  background:transparent url('images/clear_white.gif') no-repeat scroll right 0px;
  white-space:normal;
  margin:0px;
  padding:0px;
  border-spacing:0px;
  border-collapse:collapse;
  border:0px;
	position:relative;
}
.tabalicious {
  cursor:pointer;cursor:hand;
  padding:0px 15px 0px 15px;
  margin:0px 1px 0px 0px;
  color:#FFFFFF;
  line-height:30px;
  text-decoration:none;
  font-size:100%;
  font-family:tahoma,sans-serif;
  font-size-adjust:none;
  font-style:normal;
  font-variant:normal;
  text-align:center;
  border-collapse:collapse;
  float:left;
}
.tab_unselected{
	background:transparent url('images/unselected_tab.gif') repeat-x scroll 0px;
	font-weight:normal;
}
.tab_selected{
	background:transparent url('images/selected_tab.jpg') repeat-x scroll 0px;
	font-weight:bold;
}
#to_tab{
	clear:both;
	margin:0 0 0 0;
	padding:0 0 0 0;
	overflow: auto;
	position: relative;
}
#IE_TabFix{
	width:0px;
	height:0px;
	margin:0;
	padding:0;
}