/* Preload all admin images */
#mix_preload {
	display: none;
	background-image: url("../admin/images/mix_tab/left.gif");
	background-image: url("../admin/images/mix_tab/right.gif");
	background-image: url("../admin/images/mix_tab/background.gif");
	background-image: url("../admin/images/mix_tab/background-over.gif");
	}

/* Tab menus (edit, etc) */
.mix_tab_menu { display: inline; margin-top: 0.2em; float: left; padding-right: 1px; background: url("../admin/images/mix_tab/right.gif") no-repeat right top; }
	.mix_tab_menu ul { margin: 0; padding: 0; list-style:none; }

	.mix_tab_menu li { cursor: pointer; float: left; margin: 0; padding: 0 0 0 2px; }
	.mix_tab_menu a { float: left; display: block; padding: 3px 1em 2px 0.3em; }
	* html .mix_tab_menu a { padding: 2px 1em 3px 0.3em; }
	.mix_tab_menu li.disabled, .mix_tab_menu a.disabled { cursor: wait; }

	/* Text styles */
	.mix_tab_menu a, .mix_tab_menu a:hover { padding-left: 0.3em; text-decoration: none; }
	.mix_tab_menu a span img { border: none; vertical-align: middle; padding-right: 0.4em; }
	.mix_tab_menu a span img.spacer { width: 1px; height: 18px; }
	.mix_tab_menu a span, .mix_tab_menu a:hover span { font-size: 11px; font-family: Tahoma, Arial, Helvetica, Sans-serif; line-height: normal; font-weight: normal; color: black; text-decoration: none; }

	/* For standard elements */
	.mix_tab_menu li.normal   { background-image: url("../admin/images/mix_tab/left.gif"); }
	.mix_tab_menu li.normal a { background-image: url("../admin/images/mix_tab/background.gif"); background-color: transparent; }

	/* Hover starts for elements with normal */
	.mix_tab_menu li.normal_over   { background-image: url("../admin/images/mix_tab/left.gif"); }
	.mix_tab_menu li.normal_over a { background-image: url("../admin/images/mix_tab/background-over.gif"); }

/* Inline tab menus */
.mix_inline_tab_menu { display: inline; list-style: none; }
	.mix_inline_tab_menu li { display: inline; }
	.mix_inline_tab_menu img { vertical-align: middle; border: none; }
	.mix_inline_tab_menu a { text-decoration: none; }
	.mix_inline_tab_menu a:hover { text-decoration: underline; }

/* Styles for editable elements */
.mix_edit { margin: 0; padding: 0; border: dotted 1px #cc0000; }
.mix_edit_text {}
.mix_edit_activate { color:red; }

/* Style the brief menu */
#mix_menu_brief {
	display: block;
	position: absolute;
	bottom: 0px;
	left: 1px;
	font-size: 11px; font-family: Tahoma, Arial, Helvetica, Sans-serif; line-height: normal; font-weight: normal; color: black; text-decoration: none;
	}








/* All <ul> tags in the menu including the first level */
.mix_menu_brief, .mix_menu_brief  ul {
 margin: 0;
 padding: 0;
 list-style: none;
}

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.mix_menu_brief ul {
 visibility: hidden;
 position: absolute;
 top: 2.4em; /* I'm using ems rather than px to allow people to zoom their font */
 left: 0px;
 width: 150px;
}

/* Second and third etc. level submenus - position across from parent instead */
.mix_menu_brief ul ul {
 top: 0px;
 left: 155px;
}

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.mix_menu_brief li {
 float: left;
 position: relative;
 margin-right: 0px;
 padding-right: 1px;
 background: transparent url("../admin/images/mix_tab/right.gif") no-repeat right top;
}

/* Links inside the menu */
.mix_menu_brief a {
 display: block;
 padding: 2px; /* 3px */
 padding-right: 1em;
 color: #000;
 text-decoration:  none;
 background: transparent url("../admin/images/mix_tab/background.gif") no-repeat left top;
}

.mix_menu_brief a img {
	vertical-align: middle;
	border: none;
	}

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.mix_menu_brief a:hover, .mix_menu_brief a.highlighted:hover, .mix_menu_brief a:focus {
 background: transparent url("../admin/images/mix_tab/background-over.gif") no-repeat left top;
}
.mix_menu_brief  a.highlighted {
}

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.mix_menu_brief a {
 float: left;
}

/* \*/
.mix_menu_brief a {
 float: none;
}
/* */


/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .mix_menu_brief a {
 padding: 2px 3px 3px 3px;
}
/* End Hack */










/* Style the admin menu */
#mix_admin_menu_container { display: block; position: absolute; top: 1px; left: 1px; font-size: 11px; font-family: Tahoma, Arial, Helvetica, Sans-serif; line-height: normal; font-weight: normal; color: black; text-decoration: none; }
	#mix_admin_menu_container .mix_logo { float: left; display: block; width: 74px; height: 51px; }

	.mix_logo .l, .mix_logo .m, .mix_logo .r { float: left; height: 47px; display: block; }
	.mix_logo .l { width: 4px; }
	.mix_logo .m { width: 66px; background-image: url("../admin/images/logo_main.png"); vertical-align: bottom; }
	.mix_logo .r { width: 4px; }
	.mix_logo .b { clear: left; width: 74px; height: 4px; }
	.mix_logo a { position: relative; top: 30px; left: 4px; background: transparent url("../admin/images/icons/logoff.gif") no-repeat left top; display: block; height: 18px; padding: 2px 0 0 20px; color: black; text-decoration: none; }
	.mix_logo a:hover { text-decoration: underline; }

	#mix_admin_menu_container #mix_menu { float: left; position: relative; left: -2px; }

	.etc_brief { display: inline; position: static !important; top: 0 !important; left: 0 !important; }




/*

Here's a demo stylesheet used to format a menu and its content.
Feel free to alter the menu layout however you want. All you have to do is ensure the script
has the correct CSS property name (like 'visibility' or 'display') that you want it to change.

One good resource for UL/LI formatting: http://www.alistapart.com/articles/taminglists/
Consult your favourite CSS reference for editing fonts/borders/etc.

Otherwise, even if you're not very experienced at CSS, you can just go through and change
the #RGB border/background colours where suitable to customise for your site!

*/



/* HORIZONTAL FREESTYLE MENU LAYOUT */
/* All <ul> tags in the menu including the first level */
.mix_menu, .mix_menu  ul {
 margin: 0;
 padding: 0;
 list-style: none;
}

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.mix_menu ul {
 visibility: hidden;
 position: absolute;
 top: 2.4em; /* I'm using ems rather than px to allow people to zoom their font */
 left: 0px;
 width: 150px;
}

/* Second and third etc. level submenus - position across from parent instead */
.mix_menu ul ul {
 top: 0px;
 left: 155px;
}

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.mix_menu li {
 float: left;
 position: relative;
 margin-right: 0px;
}
.mix_menu li {
 left: 2px;
}

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.mix_menu ul li {
 background: #e2e2e2;
 border: 1px solid #cdcdcd;
 float: none;
 margin-right: 0;
 margin-bottom: -1px;
}
.mix_menu ul>li:last-child {
 margin-bottom: 1px;
}

/* Links inside the menu */
.mix_menu a {
 display: block;
 padding: 3px; /* 3px */
 padding-right: 1em;
 color: #000;
 text-decoration:  none;
 background: transparent url("../admin/images/mix_task_background.gif") no-repeat right bottom;
}

.mix_menu ul a {
 background-image: none;
}

.mix_menu a img {
	vertical-align: middle;
	border: none;
	}

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.mix_menu a:hover, .mix_menu a.highlighted:hover, .mix_menu a:focus {
 /* background-color: white; */
 background: transparent url("../admin/images/mix_task_background_over.gif") no-repeat right bottom;
}
.mix_menu ul a:hover, .mix_menu ul a.highlighted:hover, .mix_menu ul a:focus {
 /* background-color: white; */
 background-image: none;
 background-color: white;
}
.mix_menu  a.highlighted {

	/*
 color: #FFF;
 background-color: #C86;
 */
}

/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .mix_menu a#xyz {
      background-image: url(out.gif);
    }
    .mix_menu a#xyz:hover, .mix_menu a.highlighted#xyz, .mix_menu a:focus {
     background-image: url(over.gif);
    }
*/

/* Only style submenu indicators within submenus. */
.mix_menu a .subind {
 display:  none;
}
.mix_menu ul a .subind {
 display:  block;
 float: right;
}

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.mix_menu a {
 float: left;
}
.mix_menu ul a {
 float: none;
}
/* \*/
.mix_menu a {
 float: none;
}
/* */


/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .mix_menu a {
 padding: 2px 3px 5px 3px;
}

* html .mix_menu  ul li {
 float: left;
 height: 1%;
}
* html .mix_menu  ul a {
 height: 1%;
}
/* End Hack */


.mix_menu li {

}
.mix_menu li.highlighted, .mix_menu li:hover {

}

.mix_menu ul li {
	background-image: none;
}

/* Order Summary Styles */
.border-top { border-top: 1px lightgrey solid; }
.border-bottom { border-bottom: 1px lightgrey solid; }
.summary-header { background-color:#ddd; }
.text-right { text-align:right; }