@charset "utf-8";

/*
|--------------------------------------------------------------------------
| --- > Multiselect
|--------------------------------------------------------------------------
|
| @package		---
| @subpackage	Frontend - Multiselect
| @company		---
| @phone		201-739-3887
| @fax			---
| @author		Joey Avino
| @email		javino@gabriels.net
| @link			---
| @copyright	---
| @requires		mootools.1.2.js / form_inputs.gif (you can edit using form_inputs.psd)
|
*/

/*
|--------------------------------------------------------------------------
| --- > MULTISELECT > SETUP
|--------------------------------------------------------------------------
|
| Use this area to position all of the elements on the page.
|
*/
	/* ----- 1: Specify the size attributes you would like your multiselect object to be. 
	.multiselect { height: 100px; }
	-------------- */
		/* ----- 2: Specify the attributes for each multiselect object. -------------- */
		.multiselect .multi_attr { float: left; margin: 4px; }

			/* ----- 3: Specify images and background colors for your object. -------------- */
			.multiselect .multi_attr span { }	
	
				/* ----- 3: Specify height, padding, width, and background positioning for your object. -------------- */
				/* ----- 	This is useful when using rounded corners. If no rounded corners are used, -------------- */
				/* ----- 	set height and width to 0 on left and right spans. -------------- */
				.multiselect div span.left { width: 4px; height: 20px; }
				.multiselect div span.mid { padding: 3px 4px 5px 4px; height: 12px; }
				.multiselect div span.right { width: 4px; height: 20px; }

				/* ----- 4: Sepcify what you would like your object to look like when selected. -------------- */
				.multiselect div span.left_selected { width: 4px; height: 20px; }
				.multiselect div span.mid_selected { padding: 3px 4px 5px 4px; height: 12px; }
				.multiselect div span.right_selected { width: 4px; height: 20px; }

				/* ----- 4: Specify any link properties. -------------- */
				.multi_attr a { height: 22px; }
				.multi_attr a:hover { }

/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */

/*
|--------------------------------------------------------------------------
| --- > MULTISELECT > NECESSARY ATTRIBUTES
|--------------------------------------------------------------------------
|
| Do not edit below this line. Experienced CSS developers only.
|
*/

	.multiselect .multi_attr span { display: block; float: left; }
	.multi_attr a { outline: none; display: block; }
	.clear { clear: both;  }
	.multiselect .multiselect_checkboxes { display: none; }