﻿/*
	Terms:
		Capped:		Rounded or otherwise closed off end (no further buttons to that side).
		Separated:	Separated with some delimiting image (you intend to put more buttons).
		Open:		Nothing on that side of the button.
*/

.buttonbar_bg
{
	background-image: url('../images/ButtonBar/buttonbar.gif');
	background-repeat: repeat-x;
	height: 22px;
}

/********************************************************************************
 *				Standard button, no separators or end capping					*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar
{
    background-image: url('../images/ButtonBar/buttonbar.gif');
    background-repeat: no-repeat;
    background-position: right top;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
    cursor: default;
}
a.buttonbar:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar span
{
    background-image: url('../images/ButtonBar/buttonbar.gif');
    background-repeat: no-repeat;
    background-position: left top;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *						Button with both sides capped							*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_cap
{
    background-image: url('../images/ButtonBar/buttonbar-cap-right.gif');
    background-repeat: no-repeat;
    background-position: right top;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
}
a.buttonbar_cap:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_cap span
{
    background-image: url('../images/ButtonBar/buttonbar-cap-left.gif');
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_cap:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *			Button with the left side capped and the right side open			*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_cap_left
{
    background-image: url('../images/ButtonBar/buttonbar.gif');
    background-repeat: no-repeat;
    background-position: right top;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
}
a.buttonbar_cap_left:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap_left:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_cap_left span
{
    background-image: url('../images/ButtonBar/buttonbar-cap-left.gif');
    background-repeat: no-repeat;
    background-position: left top;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_cap_left:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap_left:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *			Button with right side capped and the left side open				*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_cap_right
{
    background-image: url('../images/ButtonBar/buttonbar-cap-right.gif');
    background-repeat: no-repeat;
    background-position: right top;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
}
a.buttonbar_cap_right:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap_right:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_cap_right span
{
    background-image: url('../images/ButtonBar/buttonbar.gif');
    background-position: left top;
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_cap_right:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap_right:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;	
    cursor: pointer;	
} 

/********************************************************************************
 *						Button with both sides separated						*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_sep
{
    background-image: url('../images/ButtonBar/buttonbar-sep-right.gif');
    background-repeat: no-repeat;
    background-position: right top;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
}
a.buttonbar_sep:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_sep span
{
    background-image: url('../images/ButtonBar/buttonbar-sep-left.gif');
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_sep:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *			Button with the left side capped and the right side open			*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_sep_left
{
    background-image: url('../images/ButtonBar/buttonbar.gif');
    background-position: right top;
    background-repeat: no-repeat;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 11px;	/* should be same size as cap/sep image (-1 for some reason) */
    text-decoration: none;
}
a.buttonbar_sep_left:link
{
	color: Black;
	text-decoration: none;
}
a.buttonbar_sep_left:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep_left:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_sep_left span
{
    background-image: url('../images/ButtonBar/buttonbar-sep-left.gif');
    background-position: left top;
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_sep_left:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep_left:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *			Button with right side capped and the left side open				*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_sep_right
{
    background-image: url('../images/ButtonBar/buttonbar-sep-right.gif');
    background-repeat: no-repeat;
    background-position: top right;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image (-1 for some reason) */
    text-decoration: none;
}
a.buttonbar_sep_right:link
{
	color: Black;
	text-decoration: none;
}
a.buttonbar_sep_right:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep_right:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_sep_right span
{
    background-image: url('../images/ButtonBar/buttonbar.gif');
    background-position: left top;
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_sep_right:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep_right:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *			Button with Separator on left side and Capped on the right			*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_sep_left_cap_right
{
    background-image: url('../images/ButtonBar/buttonbar-cap-right.gif');
    background-repeat: no-repeat;
    background-position: top right;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
}
a.buttonbar_sep_left_cap_right:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep_left_cap_right:active 
{
    background-position: bottom right;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_sep_left_cap_right span
{
    background-image: url('../images/ButtonBar/buttonbar-sep-left.gif');
    background-position: top left;
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_sep_left_cap_right:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_sep_left_cap_right:active span 
{
    background-position: bottom left;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 

/********************************************************************************
 *				Button Capped on left side and Separated on the right			*
 ********************************************************************************
																	Right Side ->
 */
a.buttonbar_cap_left_sep_right
{
    background-image: url('../images/ButtonBar/buttonbar-sep-right.gif');
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-position: top right;
    color: black;
    display: block;
    float: left;
    font: normal 8pt Arial, Verdana, Helvetica, sans-serif;
    height: 22px;
    width: 85px;
    margin-right: 0px;
    padding-right: 12px;	/* should be same size as cap/sep image */
    text-decoration: none;
}
a.buttonbar_cap_left_sep_right:hover
{
	background-position: right center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap_left_sep_right:active 
{
    background-position: right bottom;
    color: #FFFFFF;
    outline: none;
    cursor: pointer;
}
/*																	<- Left Side
	Height of Span = Height of Image
	Height of Span = line-height + padding-bottom + padding-top
 */
a.buttonbar_cap_left_sep_right span
{
    background-image: url('../images/ButtonBar/buttonbar-cap-left.gif');
    background-position: left top;
    background-repeat: no-repeat;
    display: block;
    text-align: center;
    line-height: 12px;
    padding-top: 5px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 5px;
    padding-right: 0px;
} 
a.buttonbar_cap_left_sep_right:hover span
{
	background-position: left center;
	outline: none;
	cursor: pointer;
}
a.buttonbar_cap_left_sep_right:active span 
{
    background-position: left bottom;
    padding-top: 6px;
    padding-left: 12px;		/* should be same size as cap/sep image */
    padding-bottom: 4px;
    padding-right: 0px;
    cursor: pointer;
} 