@charset "utf-8";

/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Coverflow
|--------------------------------------------------------------------------
|
| @package		Amedia Creative
| @subpackage	Frontend Framework
| @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
|
*/

/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Images
|--------------------------------------------------------------------------
|
*/

	/* ----- Declare your coverflow images. -------------- */
	.coverflow .loader { }
	.coverflow a.play { }
	.coverflow a.stop { }
	.slider_wrapper_left { }
	.slider_wrapper_right { }
	.coverflow .slider_con { }
	.coverflow a.slider_next { }
	.coverflow a.slider_prev { }
	.coverflow a.resize { }
	.coverflow .slider { }
	.coverflow .knob { }
	.coverflow .knobleft { }

	/* ----- IE6. --------------
	.coverflow a.play { }
	.coverflow a.stop { }
	.slider_wrapper_left { }
	.slider_wrapper_right { }
	.coverflow .slider_con { }
	.coverflow a.slider_next { }
	.coverflow a.slider_prev { }
	.coverflow a.resize { }
	.coverflow .slider { }
	.coverflow .knob { }
	.coverflow .knobleft { }

 */







/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Setup
|--------------------------------------------------------------------------
|
| NOTE: This element is positioned as per the viewport in JavaScript.
| This lightbox is intended to be a pre-determined size.
|
*/

	/* ----- Wrapper: Set this to the height and width you want for your coverflow. JS will adjust the height. -------------- */
	.coverflow_wrapper { width: 600px; margin: auto; }





		/* ----- Set the overall font color and size (effects photo load). -------------- */
		.coverflow { }
			.coverflow .loader { }





			/* ----- Wrapers for the images which styles may be set on. -------------- */
			.obj_wrap_style1 { }
			.obj_wrap_style2 { }
			.obj_wrap_style3 { }
				.obj_wrap_style3 img { }





			/* ----- Set where you want the caption positioned. -------------- */
			.coverflow .caption { margin: 5px auto; bottom: 80px; }





			/* ----- Set the nav height in JS using height_ratio: 0.55. -------------- */
			.coverflow .coverflow_nav { /* height_ratio: 0.55 */ }





			/* ----- Left Stop/Play button for when use_auto_play is set to true in JS. -------------- */
			.coverflow .auto_play_con { float: left; width: 10%; margin-top: 21px; height: 20px; margin-left: 2%; }
				.coverflow a.play, .coverflow a.stop { }





			/* ----- Slider for when use_slider is set to true in JS. -------------- */
			/* ----- The positioning of the slider will be handled by JS -------------- */
				/* ----- Set the width you want the slider to be. -------------- */
				.coverflow .slider_wrapper { width: 400px; }
				.coverflow .slider_con { width: 100%; }
					.coverflow .slider_con { margin: 5px auto; padding: 16px 5px 14px 5px; }
						.coverflow .slider { height: 18px; }
					.coverflow .slider_wrapper_left { height: 60px; width: 5px; }
					.coverflow .slider_wrapper_right { height: 60px;  width: 5px; }
				





			/* ----- Left and right site of the slider bar, next and previous buttons. -------------- */
			.coverflow a.slider_next, a.slider_prev { width: 37px; height: 23px; float: left; }





			/* ----- Container that holds the resize button. -------------- */
			.coverflow .resize_container { float: right; margin-right: 2%; margin-top: 21px; width: 10%; height: 23px; }
				/* ----- Resize button. -------------- */
				.coverflow a.resize { width: 33px; height: 23px; float: right; }





			/* ----- Set the height of the knob to drag. JS will take care of the width. -------------- */
			.coverflow .knob { height: 20x; }
				/* ----- Set the height and width of the image filled in this area. This is for the left side of the knob. -------------- */
				.coverflow .knobleft { width: 10px; height: 20px; }










/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */

/*
|--------------------------------------------------------------------------
| Amedia Creative Frontend Framework > Coverflow > Necessary Attributes
|--------------------------------------------------------------------------
|
| Do not edit below this line. Experienced CSS developers only.
|
*/

	.coverflow { visibility: hidden; z-index: 1; position: relative; overflow: hidden; }
	.coverflow * { outline: none; padding: 0px; margin: 0px; -moz-user-select: none;
							-webkit-user-select: none; user-select: none; -o-user-select: none; }
		.coverflow .loader { position: absolute; z-index: 1000; text-align: center; margin: 0px auto; top: 45%; width: 100%; padding: 50px 0px; }
		.coverflow a { cursor: pointer; }
		.coverflow .knob { cursor: pointer; }
		.coverflow .caption { position: absolute; text-align: center; z-index: 98;  width: 100%; }
		.coverflow .coverflow_nav { margin: 0px auto; bottom: 50px; font-size: 1px; line-height: 1px;
										width: 100%; text-align: center; position: absolute; z-index: 99; }
										
		.coverflow a.play, .coverflow a.stop { position: absolute; }
			
			.coverflow .slider_wrapper { position: absolute; }
				.coverflow .slider_con { float: left; }
					.coverflow .slider { position: relative; float: left; }
				.coverflow .slider_wrapper_left { float: left; }
				.coverflow .slider_wrapper_right { float: right; }