/*****************************************************************
 * DYNAMIC BUTTON
 * @author Ntb
 * @version 0.2.4
 * @settings for buttonHeight 20px
 * @copyright Copyright (c) 2010, Zig Websoftware
 * for A and INPUT buttons add span.buttonContainer > span
 * <span class="buttonContainer"><span><a href="#">Button</a></span></span>
 * <span class="buttonContainer"><span><input type="submit" value="Button" /></span></span>
 * Tested in FF, IE8, IE7, CH, SF
 * Needs JS to make full button clickable and hoverable for IE
 * When .buttonContainer name is changed rename in .js too
 *****************************************************************
 * When button height or font size is changed update following settings:
 * Adjust 1-8 = Update sprite coordinations
 * Adjust 2-8 = Adjust width if needed
 * Adjust 3-8 = Set global height for button with padding
 * Adjust 4-8 = Adjust clickable area for FF
 * Adjust 5-8 = Different settings for IE7
 * Adjust 6-8 = FloatFix IE8
 * Adjust 7-8 = FloatFix IE7
 * Adjust 8-8 = FloatFix FF
 *****************************************************************/
/* Reset */
span.buttonContainer,
span.buttonContainer *
{
	font-family			: Verdana, Arial, Helvetica, sans-serif;
	font-size			: 11px;
	font-weight			: bold;
	text-decoration		: none !important;
	text-transform		: uppercase;
	color				: #fff !important;

	padding				: 0 !important;
	margin				: 0;
	cursor				: pointer;
}
span.buttonContainer *
{
	margin				: 0 !important;
}
/* Set bg Images */
span.buttonContainer
{
	background			: url("/images/dButton.png") left -40px no-repeat; /* Adjust 1-8 */
	padding-left		: 12px !important; /* Adjust 2-8 */
}
span.buttonContainer span
{
	background			: url("/images/dButton.png") top right no-repeat; /* Adjust 1-8 */
	padding-right		: 13px !important; /* Adjust 2-8 */
}
/* Hover */
span.buttonContainer:hover,
span.buttonContainer.hover /* JS addon */
{
	background			: url("/images/dButton.png") left -60px no-repeat; /* Adjust 1-8 */
}
span.buttonContainer:hover span,
span.buttonContainer.hover span /* JS addon */
{
	background			: url("/images/dButton.png") right -20px no-repeat; /* Adjust 1-8 */
}
/* Default settings */
span.buttonContainer,
span.buttonContainer span
{
	padding-top			: 3px !important; /* Adjust 3-8 */
	padding-bottom		: 4px !important; /* Adjust 3-8 */
}
span.buttonContainer span input,
span.buttonContainer span a
{
	border				: none;
	background-color	: transparent;
	width				: auto !important; /* To reset default form input width */
	height				: auto !important; /* To reset default form input width */
	text-indent			: 0 !important; /* To reset possible .button value */
	white-space			: nowrap;
}
/* To make full button clickable without JS
 * Works 100% in FF, CH, SF
 * 50% in IE8 and 0% in IE7 */
span.buttonContainer span input,
span.buttonContainer span a
{
	margin				: -2px -12px -4px -12px !important; /* Adjust 4-8 */
	padding				: 2px 12px 4px 12px !important; /* Adjust 4-8 */
}
/* Button adjustments IE7 */
*+html span.buttonContainer,
*+html span.buttonContainer span
{
	padding-top			: 0 !important;
	padding-bottom		: 0 !important;
}
*+html span.buttonContainer span a
{
	margin				: 0 !important;
	padding				: 0 !important;
	padding-top			: 3px !important; /* Adjust 5-8 */
	padding-bottom		: 4px !important; /* Adjust 5-8 */
}
*+html span.buttonContainer span input
{
	margin				: 0 !important;
	padding				: 0 !important;
	padding-top			: 2px !important; /* Adjust 5-8 */
	padding-bottom		: 2px !important; /* Adjust 5-8 */
	line-height			: 1.3 !important;
    overflow			: visible;
}
/* FLOAT FIXING */
/* IE8 */
span.buttonContainer.left,
span.buttonContainer.right
{
	padding-top			: 3px !important; /* Adjust 6-8 */
	padding-bottom		: 4px !important; /* Adjust 6-8 */
}
span.buttonContainer.left input,
span.buttonContainer.right input
{
	padding-top			: 2px !important; /* Adjust 6-8 */
	padding-bottom		: 3px !important; /* Adjust 6-8 */
}
/* IE7 */
*+html span.buttonContainer.left *,
*+html span.buttonContainer.right *
{
	display				: block;
	float				: left;
}
*+html span.buttonContainer.left,
*+html span.buttonContainer.right
{
	padding-top			: 0px !important; /* Adjust 7-8 */
	padding-bottom		: 0px !important; /* Adjust 7-8 */
}
*+html span.buttonContainer.left input,
*+html span.buttonContainer.right input
{
	padding-top			: 0px !important; /* Adjust 7-8 */
	padding-bottom		: 2px !important; /* Adjust 7-8 */
}
/* FF
 * Chosen Firefox over Chrome and Safari for
 * proper display sinds they all read this code */
@-moz-document url-prefix()
{
	span.buttonContainer.left,
	span.buttonContainer.right
	{
		padding-top			: 3px !important; /* Adjust 8-8 */
		padding-bottom		: 4px !important; /* Adjust 8-8 */
	}
	span.buttonContainer.left input,
	span.buttonContainer.right input
	{
		padding-top			: 1px !important; /* Adjust 8-8 */
		padding-bottom		: 3px !important; /* Adjust 8-8 */
	}
}
/* Some margin to give buttons nice alignment when floated next to eachother */
span.buttonContainer.left
{
	float				: left;
	margin-right		: 5px;
}
span.buttonContainer.right
{
	float				: right;
	margin-left			: 5px;
}
/* OTHER COLOR BUTTONS */
/* Orange */
span.buttonContainer.dButtonOrange
{
	background			: url("/images/dButton.png") left -120px no-repeat; /* Adjust 1-8 */
}
span.buttonContainer.dButtonOrange span
{
	background			: url("/images/dButton.png") right -80px no-repeat; /* Adjust 1-8 */
}
/* Orange Hover */
span.buttonContainer.dButtonOrange:hover,
span.buttonContainer.dButtonOrange.hover /* JS addon */
{
	background			: url("/images/dButton.png") left -140px no-repeat; /* Adjust 1-8 */
}
span.buttonContainer.dButtonOrange:hover span,
span.buttonContainer.dButtonOrange.hover span /* JS addon */
{
	background			: url("/images/dButton.png") right -100px no-repeat; /* Adjust 1-8 */
}
/* OtherColor */
span.buttonContainer.dButtonOtherColor
{
	background			: url("/images/dButton.png") left -0px no-repeat; /* Adjust 1-8 */
}
span.buttonContainer.dButtonOtherColor span
{
	background			: url("/images/dButton.png") right -0px no-repeat; /* Adjust 1-8 */
}
/* OtherColor Hover */
span.buttonContainer.dButtonOtherColor:hover,
span.buttonContainer.dButtonOtherColor.hover /* JS addon */
{
	background			: url("/images/dButton.png") left -0px no-repeat; /* Adjust 1-8 */
}
span.buttonContainer.dButtonOtherColor:hover span,
span.buttonContainer.dButtonOtherColor.hover span /* JS addon */
{
	background			: url("/images/dButton.png") right -0px no-repeat; /* Adjust 1-8 */
}
/* dButton With Logo */
span.buttonContainer.dButtonPDF
{
	background			: url("/images/dButton.png") left -160px no-repeat;
	padding-left		: 22px !important;
}
span.buttonContainer.dButtonPDF:hover
{
	background			: url("/images/dButton.png") left -180px no-repeat;
}
span.buttonContainer.dButtonMAIL
{
	background			: url("/images/dButton.png") left -200px no-repeat;
	padding-left		: 32px !important;
}
span.buttonContainer.dButtonMAIL:hover
{
	background			: url("/images/dButton.png") left -220px no-repeat;
}
span.buttonContainer.dButtonPRINT
{
	background			: url("/images/dButton.png") left -240px no-repeat;
	padding-left		: 28px !important;
}
span.buttonContainer.dButtonPRINT:hover
{
	background			: url("/images/dButton.png") left -260px no-repeat;
}
/** END Dynamic Button **/
span.buttonContainer.up40
{
	position			: relative;
	margin-top			: -42px;
	z-index				: 10;
	*+margin-top		: -45px;
}