/***********************************************/
/* Edit Mode Styles                            */
/***********************************************/ 

body.edit-mode,
body.preview-mode{ margin-top: 54px; }
body.private-mode-network{ margin-top: 24px; }


/* Useful design elements */
.light_separator{
	border: none;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #fff;
	height: 2px; 
	clear: both; 
	display: block; 
	margin: 12px 0;
}

/* Modal Box Styles */

/* Page Note at top of Modals */
.modalPageNote {
		padding:8px;
		margin:4px;
		border:1px dashed #009900;
		background-image: url('/img/bg_pagenote.gif') !important;
		background-repeat:repeat-x;
		background-color:#ffffff;
		font-size:11px;
}

#button_save_element{ width: 150px; }


/* Image Preview Area
----------------------------------------------------*/
#image_preview_area,
#image_edit_options{
	border: 1px solid #ccc;
	float: left;
	padding: 8px;
	width: 360px;
	margin-top: 12px;
}
	#image_preview_area{ margin: 0; }
	
.image_preview_thumb{
	border: 1px solid #ddd;
	display: block;
	width: 86px;
	height: 80px;
	overflow: hidden;
	float: left;
	background: #fff;
	position: relative;
	margin: 2px 1px;
}
	.image_preview_thumb_dragging{}
	.image_preview_thumb img{
		display: block;
		margin: auto;
		max-height: 54px;
		max-width: 82px; /* Need to put max-width and height in ie only stylesheet */
		padding: 2px;
	}	
	#image_preview_area .bpeCommands{
		height: 20px;
		width: 100%;
		text-align: right;
	}		
	.image_preview_thumb .bpeCommands a{ 
		float: right;
		width: 16px;
		height: 16px;
		margin: 2px 1px 0 1px;
		background-image: url('/img/pscms_icons_sprite.png');
		background-repeat: no-repeat;
		cursor: pointer;
	}
		.move_image_preview{ cursor: move; background-position: -16px 0px; }
		.edit_image_preview{ background-position: 0 -16px; }
		.delete_image_preview{ background-position: 0 -32px; }
		
	#image_preview_area .image_preview_container{
		height: 78px;
		overflow: hidden;
	}
	
#imageform{ float: left; margin: 0 0 0 12px; width: 250px; }
#num_images_left{
	display:block;
	text-align: left;
	clear: both;
	margin-top: 6px;
}



/**** BPE Options in MOdal ****/
#bpe_options{
	clear: both;
	margin-top: 12px;
	padding: 12px;
	border: 1px solid #ddd;
	display: block;		
}
	#bpe_options input,
	#bpe_options select{
		float: left;
		display: block;
	}
	#bpe_options label{
		display: block;
		padding: 0;
		font-weight: bold;
	}
		#bpe_options .bpe_option{ float: left; display: block; }

/* Image Uploader styles
----------------------------------------------------*/
#image_uploader{ 
	float: right;
	width: 240px;
	display: block;
	text-align: right;
}
	#qq-upload-button{
		margin-bottom: 12px;
	}
	.qq-upload-button{
		float: left;
		font-size: 11px;
		margin-top: 0px;
	}
	.qq-upload-button:hover{  }
	
.qq-upload-list{
	text-align: left;
	padding: 0;
	list-style-type: none;
	float: right;
	width: 100%;
	margin: 0;
}
	.qq-upload-list li{ margin: 1px 0; padding: 4px; background: #0000; }
		li.qq-upload-fail{ background: #99cccc; color: #fff; }
		
	.qq-upload-file,
	.qq-upload-size,
	.qq-upload-failed-text{
		margin: 0 6px;
	}
	.qq-upload-success{ background: #ccffcc; }
	.qq-upload-file{ font-weight: bold; }
	.qq-upload-size{  }
	.qq-upload-failed-text{ float: right; display: none; }

	

/***** Edit mode bars
- flash message (green: OK, red: error [action not taken], yellow: error [link to fix and redo action])
- accountBar
- editBar
******/

#adminBar{
	border-bottom: 1px solid #cc9900;	
	color:#565656;
	font-size: 11px !important;
	font-family: Arial, sans-serif !important;
	height: 51px;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9999;	
	-moz-box-shadow: 0px 1px 2px #666;
	-webkit-box-shadow: 0px 1px 2px #666;
	box-shadow: 0px 1px 2px #666;		
}
	.public-mode #adminBar,
	.private-mode-network #adminBar{ height: 22px; }
	#adminBar a{ font-weight: normal; text-decoration: none; color: #333; }
	#adminBar a:hover{ text-decoration: underline; color: #fff; }
	
	#site_map{ color: #252525; }
	
	#adminGlobalBar,
	#adminSiteBar{
		text-align: right;
		position: absolute; 
		right: 6px;
		top: 6px;
		height: 20px;
	}
		/*.public-mode #adminGlobalBar{ text-align: left; left: 6px; }*/
		#adminGlobalBar span a,
		#adminSiteBar span a{ margin-left: 12px; }
		
		/* Link colors for the global and site wide bars */
		#adminSiteBar span a{ color: #333; }
		#adminSiteBar span a:hover{ color: #fff; }
		#adminGlobalBar span a{ color: #333; }
		#adminGlobalBar span a:hover{ color: #666; }
	
	#accountBar{
		height: 20px;
		border-bottom: 1px solid #363636;
		padding: 2px 0 0 6px;
		background-color: #dfdfdf;
		background-image: -moz-linear-gradient(100% 100% 90deg, #efefef, #cfcfcf);
		background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#efefef), to(#cfcfcf));	
	}
	#editBar{
		height: 24px;
		background-color: #ff8a00; /* fallback color */
		background-image: -moz-linear-gradient(100% 100% 90deg, #cc9900, #ff8a00);
		background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cc9900), to(#ff8a00));
		border-top: 1px solid #ff8a00;
		padding-top: 3px;
		position: relative;
	}
		#editBar select{
			border: 1px solid #363636;
			color: #FFFFFF;
			font-size: 11px;
			height: 22px;
			padding: 0px;
			-moz-border-radius: 4px 4px 4px 4px;
			border-radius: 4px;	
			background-color: #464646; /* fallback color */
			background-image: -moz-linear-gradient(100% 100% 90deg, #252525, #464646);
			background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#252525), to(#464646));
		}
			#editBar select option{ padding: 4px; }
		#editBar ul, 
		#accountBar ul{ list-style: none; margin: 0; padding: 0; }
			#editBar ul li, 
			#accountBar ul li{ padding-right: 10px; display: inline; margin: 0; }

		
		
		
/***** Buttons *****/
a.button{
    display: block;
    margin: 0 4px;
	color: #fff !important;
    cursor: pointer;
    padding: 3px 7px; /* Links */
	background-color: #464646; /* fallback color */
	background-image: -moz-linear-gradient(100% 100% 90deg, #464646, #252525);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#464646), to(#252525));
    border: 1px solid #363636;	
	-moz-border-radius: 4px;
	border-radius: 4px;	
}
	.button:hover	{ 	background-color:#333; color:#fff; border: 1px solid #999; }
	.button:active, 
	.buttonActive	{	background-color:#6299c5; color:#fff; }
	.buttonPositive	{ 	background-color:#529214; color:#fff; }
	.buttonNegative	{ 	background-color:#d12f19; color:#fff; }

	.addElementsLink a.addButton{
		display:block;
		width: 100%;
		height: 24px;
		color: #ccffcc;
		margin: 0;
		font-weight: bold; 
		text-align: center;
		position: relative;
		top: 4px;
		z-index: 300;
	}
		.addElementsLink a.addButton:hover{ color: #fff; }

	/***** Page options bar Enabled / Disabled page styles **/
	.page_enabled{
		background-color: #009900; /* fallback color */
		background-image: -moz-linear-gradient(100% 100% 90deg, #006600, #009900);
		background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#006600), to(#009900));
		border-top: 1px solid #00CC00;
		border-bottom: 1px solid #009900;
	 }
	 
	.page_disabled{ 
		background-color: #660000; /* fallback color */
		background-image: -moz-linear-gradient(100% 100% 90deg, #660000, #990000);
		background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#660000), to(#990000));
		border-top: 1px solid #CC0000;
		border-bottom: 1px solid #990000;
	}


/***********************************************/
/* Editable Region Styles                     */
/***********************************************/ 
#levelTwoNav .sideArrows{
	float: left;
	background: #ff8a00;
	padding: 0;
	height: 23px;
	border-bottom: 1px solid #333;
}
	#levelTwoNav .sideArrows a{
		margin: 5px 1px; padding: 0;
		display: block;
		width: 7px;
		height: 4px;
		background: #ff8a00;
		border: none;
	}

#levelTwoNav .sideDel,
#levelThreeNav div.sideDel{ float: right; }
	#levelTwoNav div.sideDel a,
	#levelThreeNav div.sideDel a{
		margin: 0;
		padding: 1px;
	}

#levelThreeNav .sideArrows{
	float: left;
	background: #ff8a00;
	padding: 0;
	height: 23px;
}
	#levelThreeNav .sideArrows a{
		margin: 5px 1px; padding: 0;
		display: block;
		width: 7px;
		height: 4px;
		background: #ff8a00;
		border: none;
	}
		#levelThreeNav .sideArrows a:hover{ background: #ff8a00; }

/***********************************************/
/* Edit Basic Page Styles                      */
/***********************************************/ 

.addElementsLink{
	z-index: 299;
	background-color: #009900; /* fallback color */
	background-image: -moz-linear-gradient(100% 100% 90deg, #006600, #009900);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#006600), to(#009900));
	border-top: 1px solid #00CC00;
	border-bottom: 1px solid #009900;
	color: #ffffff !important;	
	clear: both;
	cursor:pointer;	
	display:block;	
	font-family: Arial, Verdana, sans-serif !important;	
	margin: 12px 4px;
	text-align: center;	
}
	.draggable{ border: 1px dashed #cc6600; margin: 12px 0px; }
		.preview-mode .draggable{ border: none; }
	.droppable_highlight{ border-top: 8px solid #FF8A00; }

.bpeCommandElement{ font-size: 11px !important; }
.bpeCommands {
	background-color: #ff8a00; /* fallback color */
	background-image: -moz-linear-gradient(100% 100% 90deg, #cc9900, #ff8a00);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cc9900), to(#ff8a00));
    border-bottom: 1px solid #AA9900;
    border-top: 1px solid #FFCC00;
	color: #252525;
	text-decoration: none;
	height: 24px;
	position: relative;
	z-index: 400;
}
	.bpeCommands h4{
		font-size: 12px;
		padding: 3px;
		margin: 3px;
	}
	.bpeNewsArticleCommands{
		float: right;
		list-style-type: none;
		margin: 0;
		padding: 0;
		position: absolute;
		right: 6px;
		top: 6px;
		width: 34px;
	}
		#levelTwoNav .bpeCommands,
		#levelThreeNav .bpeCommands{ height: 20px; }
		#levelTwoNav .bpeCommands ul.bpeActions,
		#levelThreeNav .bpeCommands  ul.bpeActions{ width: 36px; height: 20px; }		
		.bpeNewsArticleCommands li{ float: left; }
	
.bpeType {
	height: 16px;
	color: #252525 !important;
	font-size: 12px !important;	
	font-family: Arial, Verdana !important;
	text-transform: uppercase;
	font-weight: bold;
	padding: 4px 0 0 6px;
	float: left;
}
.bpeActions{
	list-style-type: none; 
	float: right;
	padding: 0;
	margin: 0;
	right: 2px;
	top: 4px;
	top: 4px;
	position: absolute;
}
	/* Add Level1 page button in the top right of the nav */
	#addLevelOnePage{ background: #ff8a00;  border-left: 1px solid #fff !important; }
		td#addLevelOnePage a{ position: relative; top: 1.6em; left: 10px; }
	
	#levelOneNavBar .bpeActions{
		margin: 0 auto; 
		width: 64px;
		position: relative;
		top: 4px;
		float: none;
	}
		#levelOneNavBar .bpeActions li a{ float: left; margin: 0 0 0 2px;}	

	.bpeActions li,
	.bpeAction_icon{ 
		float: left; 
		margin: 0 1px;
		cursor: pointer;
	}
		.bpeActions li a,
		.bpeAction_icon,
		.bpeAction_icon a,
		.bpeAction_icon span{ width: 16px; height: 16px; display: block !important; padding: 0px !important; }
		
		.bpeActions li a,
		.bpeAction_icon a,
		.bpeAction_icon span{ 
			background-image: url('/img/pscms_icons_sprite.png') !important;
			background-color: transparent !important;
			text-indent: -9999em;
			text-decoration: none !important;
		}
			.nolink a{ cursor: default; }
			a.bpeAction_move		{ 	background-position: 0 0px ; cursor: move; }
			a.bpeAction_move_any 	{	background-position: -16px -16px; cursor: move;	}									
			a.bpeAction_edit		{ 	background-position: 0 -16px; 		}
			a.bpeAction_delete		{ 	background-position: 0 -32px; 		}
			a.bpeAction_lock		{ 	background-position: 0 -56px; 		}		
			a.bpeAction_move_left,
			a.bpeAction_move_right	{	width: 8px !important;				}
			a.bpeAction_move_left	{	background-position: 0 -72px; 		}
			a.bpeAction_move_right	{	background-position: -8px -72px; 	}
			a.bpeAction_move_up,
			a.bpeAction_move_down	{	width: 8px !important;				}	
			a.bpeAction_move_up		{	background-position: 0 -88px; 		}
			a.bpeAction_move_down 	{	background-position: 0px -98px; 	}			
			a.bpeAction_add			{ 	background-position: 0 -104px; 		}	
			a.bpeAction_pageStatus	{	background-position: 0 -448px; 		}
			a.bpeAction_access		{	background-position: -128px 0;		}
			a.bpeAction_permission	{	background-position: -144px 0;		}
			a.bpeAction_user		{	background-position: -112px 0;		}
			a.bpeAction_share_ical	{	background-position: -160px -144px;	}
			a.bpeAction_edit_recur	{	background-position: -176px -64px; }
			a.bpeAction_delete_recur{ 	background-position: -176px -80px; }
			a.bpeAction_user		{	background-position: -112px 0;		}
			a.bpeAction_share_ical	{	background-position: -160px -144px;	}						
			a.bpeAction_user		{	background-position: -112px 0;		}
			a.bpeAction_share_ical	{	background-position: -160px -144px;	}						
			.bpeAction_corner		{	background-position: -192px -32px;	}
			
			#pageOptionsTable .bpeAction_icon{ position: relative; top: 2px; margin-right: 6px; }

	#levelTwoLinksAdd{ margin-top: 10px;}
	#level3LinksAdd{ height: 24px !important; }
					
	#levelTwoLinksAdd a,
	#level3LinksAdd a{ 
		background-color: transparent !important;
		border: none; 
		color: #252525;
		text-decoration: none; 
	}
		#levelTwoLinksAdd a:hover,
		#level3LinksAdd a:hover{ color: #fff; }
	
					
/***********************************************/
/* Sprites			                           */
/***********************************************/ 
.ui_icon,
.ui_button{
	background: transparent url('/img/pscms_icons_sprite.png') no-repeat;
	overflow: hidden;
	outline: none;
	border: none;
	text-decoration: none;
	float: left;
	display: block;
	margin: 0;
	text-indent: -9999em;
}
	/* regular button */
	.button_regular{
		background-color: #cc9900; /* fallback color */
		background-image: -moz-linear-gradient(100% 100% 90deg, #cc9900, #ff8a00);
		background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cc9900), to(#ff8a00));
		border-top: 1px solid #ff8a00;
		border-bottom: 1px solid #cc9900;			
		width: 58px;
		height: 22px;
		margin: 0 4px;		
	}
	
	/* Icons */
	.icon_16{	width: 16px;	height: 16px;	}
	.icon_48{	width: 48px;	height: 48px;	padding: 18px 24px; }
		.ui_icon_preview_mode_large			{	background-position: -208px 0px		}
		.ui_icon_edit_mode_large			{	background-position: -208px -48px	}
		.ui_icon_check_mark					{	background-position: 0px -272px 	}	
		.ui_icon_x_mark						{	background-position: 0px -288px 	}			
		
	
	/* Buttons */
	.button_80x32{	width: 58px;	height: 22px; margin: 0px 4px;	}
		.preview-mode .ui_button_edit_mode			{	background-position: -336px 0px 	}
		.edit-mode .ui_button_edit_mode				{	background-position: -336px -23px	}			
		.ui_button_edit_mode:hover					{	background-position: -336px -46px	}
		
		.preview-mode .ui_button_preview_mode		{	background-position: -336px -115px	}
		.edit-mode .ui_button_preview_mode			{	background-position: -336px -69px	}		
		.ui_button_preview_mode:hover				{	background-position: -336px -92px	}
		
		.ui_button_live_mode					{	background-position: -336px -138px	}		
		.ui_button_live_mode:hover				{	background-position: -336px -161px	}
		
		/* Buttons for enable disbaling a page */
		.page_disabled #ui_button_enable_page		{	background-position: -256px -192px 	}		
		.page_enabled #ui_button_enable_page			{	background-position: -256px -256px	}							
		.page_disabled #ui_button_enable_page:hover	{	background-position: -256px -224px	}
		
		.page_disabled #ui_button_disable_page		{	background-position: -256px -352px	}		
		.page_enabled #ui_button_disable_page		{	background-position: -256px -288px	}
		.page_enabled #ui_button_disable_page:hover	{	background-position: -256px -320px	}


/***********************************************/
/* BPE Element Styles                          */
/***********************************************/ 
.bpeStatsLoader {
	background-image:#efefef  /* alerts */;
	background-repeat:repeat-x;
	margin:auto;
	padding:10px;
	font-size:10px;
	color:#333333;
	width: 200px;
	margin-bottom:20px;
}



/***********************************************/
/* Form Styles                                 */
/***********************************************/ 
form {
	clear: both;
	padding: 0;
	width: 98%;
}
	form div.row {
		clear: both;
		margin-bottom: 4px;
		padding: 3px;
		vertical-align: text-top;
	}
	form div.input {
		color: #444;
		margin-left: 0;
		padding-left: 0;
	}

	form div.required {
		color: #333;
		font-weight: bold;
	}
	form div.submit {
		border: 0;
		clear: both;
		margin-top: 10px;
	}

.legend {
	color: #ff8a00;
	font-size: 140%;
	font-weight: bold;
}
fieldset {
	border: 1px solid #ccc;
	margin-top: 10px;
	padding: 10px 15px;
	font-size: 11px;	
}
	fieldset p { margin: 0 0 4px 0; padding: 0; }
	fieldset legend { color: #ff8a00; font-size: 140%; font-weight: bold;	}
	fieldset h3{ color: #ff8a00; font-weight: normal; font-size: 120% }
	fieldset fieldset { margin: 10px 0; padding: 10px 10px; }
		fieldset fieldset legend { font-size: 120%; font-weight: normal; margin-left: 20px; }
		fieldset fieldset div { clear: left; margin: 0; }
		

label {
	display: block;
	font-size: 11px;
	font-weight: normal;
	padding-right: 20px;
	padding-bottom: 4px;
}

input[type=text], textarea {
	clear: both;
}
input[type=checkbox] {
	clear: left;
	float: left;
	margin: 0px 6px 7px 2px;
	width: auto;
}
/*
input[type=submit] {
	display: inline;
	padding: 2px 5px;
	width: auto;
}
*/
input[type=radio]{
	display: inline;
	padding-right: 5px;
}

.layoutSelector
{
	text-align: center; width: 129px; display: inline-block; margin-right: 3px;
}
 

/***********************************************/
/* Flash Messages                               */
/***********************************************/ 
#flash_ok,
#flash_not_ok{ margin: 0 0 0 6px; text-align: left; float: left; height: 16px; width: auto; }
	.flashMsg {
		margin: 0 0 0 20px;
		padding: 0;
		display: block;
		color: #fff;
		padding: 0px 6px;
	}
	
.red 		{	background-color:#990000;	}
.green		 {	background-color:#009900;	}

#tutorialsHolder {	border:2px solid #ccc; }
#alerts {
	background: #252525 /* alerts */;
	background-color: #000;
	float:left;
	padding:10px;
	width:480px;
	margin:10px;
	border:1px solid #ff0000;
	margin-bottom:20px;
	color: #ffffff;
}
#privatePageList {
	background: #252525 /* alerts */;
	background-color: #000;
	float:left;
	padding:10px;
	width:1000px;
	margin:10px;
	border:1px solid #ff0000;
	margin-bottom:20px;
	color: #ffffff;
}
	
.privatePageListItem {
		border:1px dashed #666666;			
		font-size: 14px;
		margin:6px;
		margin-bottom:8px;
		width:90%;
		padding:8px;
}
#webtips {
	background: #252525 /* alerts */;
	background-color: #000;
	float:left;
	padding:10px;
	width:480px;
	margin:10px;
	border:1px solid #ff0000;
	margin-bottom:20px;
	color: #ffffff;
}
#alerts a {
	color: #ff0000;
}
#webtips a {
	color: #ffcc00;
}
.alert {
		border:1px dashed #666666;	
		font-size: 14px;
		margin:6px;
		margin-bottom:8px;
		width:90%;
		padding:8px;
}
.webtip {
		border:1px dashed #666666;			
		font-size: 14px;
		margin:6px;
		margin-bottom:8px;
		width:90%;
		padding:8px;
}
.tab_button {
		font-size:13px;
		width:120px;
		color:#ffffff;
		background-color:#666666;
		padding:4px;
		text-decoration:none;
		margin-bottom:10px;
		
}
/***********************************************/
/* Page Options                   */
/***********************************************/ 

#pageOptions{
	color: #ffffff;
	height: 48px;
	position: relative;
}
	#pageOptions a#manage_private_users,
	#pageOptions a#manage_editable_users{ color: #fff; }
	.pageOptionsForm { margin:0; font-size:11px; position: relative; left: 24px;	}

#pageOptionsTable{ height: 28px; top: 8px; position: relative; }
	#pageOptions #pageOptionsTable tr td { text-align: left; vertical-align: top; }

	
#manageUsers { border: 1px solid #cccccc;}
	#manageUsers td {
		padding:2px;
		border-bottom:1px solid #cccccc;
		margin-bottom:2px;
		line-height:18px;
	}
	#manageUsers .header { background-color:#cccccc; font-weight:bold; }
	#manageUsers .subheader { background-color:#eeeeee; font-weight:bold; }
	#manageUsers .alternate { background-color:#eeeeee; }
	
#manageUsersAccess { border: 1px solid #cccccc; width: 100%; }
	#manageUsersAccess td {
			padding:2px;
			border-bottom:1px solid #cccccc;
			margin-bottom:2px;
			line-height:18px;
	}
	#manageUsersAccess .header { background-color:#cccccc; font-weight:bold; }
	#manageUsersAccess .subheader { background-color:#eeeeee; font-weight:bold; }
	#manageUsersAccess .alternate { background-color:#eeeeee; }

#userMenu {
	background-color:#666666;
	display:block;
	height: 26px;
}	
	#userMenu a {
		background-color:#666666;
		border-left:1px solid #737373;
		color:#FFFFFF;
		display:block;
		float:left;
		font-size:11px;
		font-weight:normal;
		padding:4px 14px;
		text-decoration:none;
	}
	
#userAccess{
	width: 350px;
	margin-left: 6px;
}
#sectionAccessTable { margin-bottom:5px; }
	#sectionAccessTable td {
			border-bottom:1px dashed #cccccc;
			padding:2px;
	}
	#sectionAccessTable .icon{ border: none; }

/* For the admin panel page navigation */
.actions{
	margin-bottom: 15px;
}

/* button 
---------------------------------------------- */
.button {
	display: block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	text-transform: uppercase;		
	font: 14px/100%;
	padding: .5em 2em .55em;
	text-shadow: 0px 1px 0px #464646;
	-moz-box-shadow: 0px 1px 0px #575757;
	-webkit-box-shadow: 0px 1px 0px #575757;
	box-shadow: 0px 1px 0px #575757;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#464646')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#464646');
}
	.button:hover {
		text-decoration: none;
	}
	.button:active {
		position: relative;
		top: 1px;
	}

.rounded{ border-radius: 4px; }

.button_medium{
	font-size: 12px;
	padding: .4em 1.5em .42em;
}
.button_small{
	font-size: 11px;
	padding: .2em 1em .275em;
}

.text_button{
	padding: 6px; 
	text-transform: uppercase;
	font-size: 10px;
	text-shadow: 0px 1px 0px #fff;
	font-weight: bold;
}
	.text_button a{ color: #6e6e6e; padding: 3px; }
	.text_button a:hover{ color: #575757; }
	.text_button a:active{ color: #888888; }

/* Gradient Colors
-------------------------------------------*/
.grad_gray{
	color: #ffffff;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
	background: -moz-linear-gradient(top,  #888,  #575757);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
	.grad_gray:hover {
		background: #616161;
		background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
		background: -moz-linear-gradient(top,  #757575,  #4b4b4b);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
	}
	.grad_gray:active {
		color: #eeeeee;
		background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
		background: -moz-linear-gradient(top,  #575757,  #888);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
	}
	
/* orange */
.grad_orange {
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
	background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
.grad_orange:hover {
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
	background: -moz-linear-gradient(top,  #f88e11,  #f06015);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.grad_orange:active {
	color: #fcd3a5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
	background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}	
	
/* green */
.grad_green {
	color: #e8f0de;
	border: solid 1px #538312;
	background: #64991e;
	background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
	background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
	.grad_green:hover {
		background: #538018;
		background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
		background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
	}
	.grad_green:active {
		color: #a9c08c;
		background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
		background: -moz-linear-gradient(top,  #4e7d0e,  #7db72f);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
	}	
	
		
/* Text and Box Shadows
------------------------------------------------------*/
.box_shadow_light{
	-moz-box-shadow: 0px 1px 1px #fff;
	-webkit-box-shadow: 0px 1px 1px #fff;
	box-shadow: 0px 1px 1px #fff;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#ffffff')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#ffffff');
}
	.box_shadow_light:hover{}
	.box_shadow_light:active{}
.box_shadow_dark{
	-moz-box-shadow: 0px 1px 0px #575757;
	-webkit-box-shadow: 0px 1px 0px #575757;
	box-shadow: 0px 1px 0px #575757;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#464646')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#464646');
}
	.box_shadow_dark:hover{
		-moz-box-shadow: 0px 1px 0px #616161;
		-webkit-box-shadow: 0px 1px 0px #616161;
		box-shadow: 0px 1px 0px #616161;
		-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#616161')";
		filter: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=90, Color='#616161');
	}
	.box_shadow_dark:active{}

.text_shadow_light{ text-shadow: 0px 1px 0px #eeeeee; }
	.text_shadow_light:hover{ text-shadow: 0px 1px 0px #ddd; }
	.text_shadow_light:active{ text-shadow: 0px 1px 0px #ffffff; }
	
.text_shadow_dark{ text-shadow: 0px 1px 0px #464646; }
	.text_shadow_dark:hover{ text-shadow: 0px 1px 0px #333; }
	.text_shadow_dark:active{ text-shadow: 0px 1px 0px #666; }	





/******* Utility classes *********/
.clear{
  clear: both;
  display: block;
  font-size: 0;
  content: '.';
  visibility: hidden; 
  width:0;
  height: 0;
  margin: 0;
  padding: 0;
}
/* Utility Class
-----------------------------------------------------*/
.align_center{ text-align: center; margin: auto; }
.align_left{ text-align: left; margin-left: 0; margin-right: auto; }
.align_right{ text-align: right; margin-left: auto; margin-right: 0; }