@charset "utf-8";

/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Tabs
|--------------------------------------------------------------------------
|
| @package		Amedia Creative Frontend Framework
| @subpackage	Frontend - Accordian
| @company		Amedia Creative, Inc.
| @phone		310/651/8733
| @fax			310/388/1210
| @author		Joey Avino
| @email		joey@amediacreative.com
| @link			http://www.amediacreative.com
| @copyright	2008 Amedia Creative, Inc.
| @requires		mootools.1.2.js / tabs.gif (you can edit using tabs.psd)
|
| NOTES: 	It's recommended you do not change the names of these class
|			but you specify an ID to use and add properties to that.
|
| 			Keep in mind that div { position: relative; } needs to be
|			set as global styles.
|
|			Use background images for borders for the tabs.
|			Specifying borders in CSS will throw off the positioning of
|			all of the elements and it's very difficult to fix. You may
|			use CSS borders for the content holder.
|
*/

/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Tabs > Setup
|--------------------------------------------------------------------------
|
| Use this area to position all of the elements on the page.
|
*/

	/* ----- 1: Set the width and position you want the entire tab box. -------------- */
	/*.tab_wrapper { width: 900px; }*/

	/* ----- 2: Set the height you want the tabs using font style and padding (not height) -------------- */
	.tab_menu a { padding: 4px 4px; }

	/* ----- 3: Set how you would like the tabs spaced. -------------- */
	.tab_menu li { margin-right: 3px; }

	/* ----- 4: Set the type of border/backround/font color you would like for the tabs -------------- */
	.tab_menu a { }

	/* ----- 5: Set the background/font/style attributes you want to use for the content pages. -------------- */
	.tab_content { }

	/* ----- 6: Set the border. If you don't want one, you may leave this blank.  -------------- */
	.tab_content {

		/* ----- Image or CSS Border -------------- */
		/* ----- Set this to the negation of the stroke of your border -------------- */
		top: -1px;
		
	}

	/* ----- 7: Set what you want the tab to look when on that page. -------------- */
	.tab_menu a.selected { }

	/* ----- 8: Set what you want the tab to look when rolled over. -------------- */
	/* ----- 	We don't use a:hover. -------------- */
	.tab_menu a.hover { }





	/* ----- ROUNDED CORNERS -------------- */
	/* ----- To use rounded corners on the tabs, use the below CSS. -------------- */
	/* ----- If you would like to omit rounded coreners, leave these items blank. -------------- */
	/* ------------------------------------------------------------------------------------------------------------------ */

	/* ----- 9: Set the background image of the li tag and the a to be the same thing. -------------- */
	.tab_menu li { }
	.tab_menu a { }
	.tab_menu a.selected  { }
	.tab_menu a.hover { }

		/* ----- Default image positioning as per tabs.psd -------------- */
		.tab_menu li { }
		.tab_menu li.selected  { }
		.tab_menu li.hover { } /* -100 for old hover */
	
		.tab_menu a { }
		.tab_menu a.selected  { }
		.tab_menu a.hover { } /* -100 for old hover */

	/* ----- 10: Set margin of the link to be the width of your rounded corner from the image file. -------------- */
	.tab_menu a { margin-right: 4px; }

	/* ----- 11: Set the padding-left of the a tag to be the number specified in step 2 added to the margin-right set in step 10. -------------- */
	.tab_menu a { padding-left: 4px; }









/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Tabs > Account > Message
|--------------------------------------------------------------------------
|
| Tabs for the account message page.
|
*/

	#messagebox_tabs_content { display: none; }
	#message .tab_wrapper { }
	#messagebox_tabs { height: 25px; }








/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */

/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Tabs > Necessary Attributes
|--------------------------------------------------------------------------
|
| Do not edit below this line. Experienced CSS developers only.
|
*/


	.tab_wrapper ul { margin: 0px; padding: 0px; }

	.tab_menu { z-index: 2; }
		.tab_menu li { cursor: pointer; display: inline; float: left; }
			.tab_menu li {}
				.tab_menu a { display: block; background-repeat: no-repeat; }
				.tab_menu .last_link { margin-right: 0px; }

			li span.rounded_left { top: 0px; left: 0px; display: none; z-index: 3; }
			li span.rounded_right { top: 0px; right: 0px; display: none; z-index: 3; }


	.tab_content { overflow: auto; z-index: 1;  }
		.tab_page { display: none; }

	.clear { clear: both; }
	
	div { position: relative; }
	
		
