.button {
	position:relative;
    display: inline-block;
    cursor: pointer;
    margin: 0.5em;
    padding:0.6em 25px .6em 33px;
    position: relative;
    text-align: center;
	font: 1em/100% Arial, Helvetica, sans-serif;
    text-decoration: none;
	vertical-align: baseline;
	outline: none;
	-webkit-border-radius: .9em;
	-moz-border-radius: .9em;
	border-radius: .9em;
}
.button span {
    margin-top: -9px;
    position: absolute;
    top: 50%;
	left:10px;
	display:inline-block;
	height: 18px;
	width: 18px;
	vertical-align:middle;
	-moz-box-shadow: 0px 1px 0 rgba(255,255,255,.4);
	-webkit-box-shadow: 0px 1px 0 rgba(255,255,255,.4);
	box-shadow: 0px 1px 0 rgba(255,255,255,.4);
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
}


/* HD/"retina" sprite
-----------------------------------------------------------------------------------------------------------*/
.button span {
	background: 						#666 /*{global-icon-color}*/;
	background: 						rgba(0,0,0,.4) /*{global-icon-disc}*/;
	background-image: url(/image/icons-18-white.png) /*{global-icon-set}*/;
	background-repeat: no-repeat;
	-moz-border-radius: 				9px;
	-webkit-border-radius: 				9px;
	border-radius: 						9px;
}



/* ----------------------------------- b ------------------------------------------ */

.blue {
	-moz-box-shadow: 0px 1px 0 				rgba(255,255,255,.3);
	-webkit-box-shadow: 0px 1px 0 			rgba(255,255,255,.3);
	box-shadow: 0px 1px 0 					rgba(255,255,255,.3);
	border: 1px solid 		#145072 /*{b-bup-border}*/;
	background: 			#2567ab /*{b-bup-background-color}*/;
	font-weight: bold;
	color: 					#fff /*{b-bup-color}*/;
	text-shadow: 0 /*{b-bup-shadow-x}*/ -1px /*{b-bup-shadow-y}*/ 1px /*{b-bup-shadow-radius}*/ #145072 /*{b-bup-shadow-color}*/;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #5f9cc5 /*{b-bup-background-start}*/), to( #396b9e /*{b-bup-background-end}*/)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#5f9cc5 /*{b-bup-background-start}*/, #396b9e /*{b-bup-background-end}*/); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(#5f9cc5 /*{b-bup-background-start}*/, #396b9e /*{b-bup-background-end}*/); /* FF3.6 */
	background-image:     -ms-linear-gradient(#5f9cc5 /*{b-bup-background-start}*/, #396b9e /*{b-bup-background-end}*/); /* IE10 */
	background-image:      -o-linear-gradient(#5f9cc5 /*{b-bup-background-start}*/, #396b9e /*{b-bup-background-end}*/); /* Opera 11.10+ */
	background-image:         linear-gradient(#5f9cc5 /*{b-bup-background-start}*/, #396b9e /*{b-bup-background-end}*/);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5f9cc5', endColorstr='#396b9e',GradientType=0 ); /* IE6-8 */
}
.blue:hover {
	border: 1px solid 		#00516e /*{b-bhover-border}*/;
	background: 			#4b88b6 /*{b-bhover-background-color}*/;
	font-weight: bold;
	color: 					#fff /*{b-bhover-color}*/;
	text-shadow: 0 /*{b-bhover-shadow-x}*/ -1px /*{b-bhover-shadow-y}*/ 1px /*{b-bhover-shadow-radius}*/ #014D68 /*{b-bhover-shadow-color}*/;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #72b0d4 /*{b-bhover-background-start}*/), to( #4b88b6 /*{b-bhover-background-end}*/)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#72b0d4 /*{b-bhover-background-start}*/, #4b88b6 /*{b-bhover-background-end}*/); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(#72b0d4 /*{b-bhover-background-start}*/, #4b88b6 /*{b-bhover-background-end}*/); /* FF3.6 */
	background-image:     -ms-linear-gradient(#72b0d4 /*{b-bhover-background-start}*/, #4b88b6 /*{b-bhover-background-end}*/); /* IE10 */
	background-image:      -o-linear-gradient(#72b0d4 /*{b-bhover-background-start}*/, #4b88b6 /*{b-bhover-background-end}*/); /* Opera 11.10+ */
	background-image:         linear-gradient(#72b0d4 /*{b-bhover-background-start}*/, #4b88b6 /*{b-bhover-background-end}*/);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#72b0d4', endColorstr='#4b88b6',GradientType=0 ); /* IE6-8 */
}
.blue:active {
	border: 1px solid 		#225377 /*{b-bdown-border}*/;
	background: 			#4e89c5 /*{b-bdown-background-color}*/;
	font-weight: bold;
	color: 					#fff /*{b-bdown-color}*/;
	text-shadow: 0 /*{b-bdown-shadow-x}*/ -1px /*{b-bdown-shadow-y}*/ 1px /*{b-bdown-shadow-radius}*/ #225377 /*{b-bdown-shadow-color}*/;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #396b9e /*{b-bdown-background-start}*/), to( #4e89c5 /*{b-bdown-background-end}*/)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#396b9e /*{b-bdown-background-start}*/, #4e89c5 /*{b-bdown-background-end}*/); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(#396b9e /*{b-bdown-background-start}*/, #4e89c5 /*{b-bdown-background-end}*/); /* FF3.6 */
	background-image:     -ms-linear-gradient(#396b9e /*{b-bdown-background-start}*/, #4e89c5 /*{b-bdown-background-end}*/); /* IE10 */
	background-image:      -o-linear-gradient(#396b9e /*{b-bdown-background-start}*/, #4e89c5 /*{b-bdown-background-end}*/); /* Opera 11.10+ */
	background-image:         linear-gradient(#396b9e /*{b-bdown-background-start}*/, #4e89c5 /*{b-bdown-background-end}*/);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#396b9e', endColorstr='#4e89c5',GradientType=0 ); /* IE6-8 */
}



/* plus minus */
.button .icon-plus {
	background-position: 	-0 50%;
}
.button .icon-minus {
	background-position: 	-36px 50%;
}

/* delete/close */
.button .icon-delete {
	background-position: 	-72px 50%;
}

/* arrows */
.button .icon-arrow-r {
	background-position: 	-108px 50%;
}
.button .icon-arrow-l {
	background-position: 	-144px 50%;
}
.button .icon-arrow-u {
	background-position: 	-180px 50%;
}
.button .icon-arrow-d {
	background-position: 	-216px 50%;
}

/* misc */
.button .icon-check {
	background-position: 	-252px 50%;
}
.button .icon-gear {
	background-position: 	-288px 50%;
}
.button .icon-refresh {
	background-position: 	-324px 50%;
}
.button .icon-forward {
	background-position: 	-360px 50%;
}
.button .icon-back {
	background-position: 	-396px 50%;
}
.button .icon-grid {
	background-position: 	-432px 50%;
}
.button .icon-star {
	background-position: 	-468px 50%;
}
.button .icon-alert {
	background-position: 	-504px 50%;
}
.button .icon-info {
	background-position: 	-540px 50%;
}
.button .icon-home {
	background-position: 	-576px 50%;
}
.button .icon-search,
.button .icon-searchfield {
	background-position: 	-612px 50%;
}
.button .icon-checkbox-off {
	background-position: 	-684px 50%;
}
.button .icon-checkbox-on {
	background-position: 	-648px 50%;
}
.button .icon-radio-off {
	background-position: 	-756px 50%;
}
.button .icon-radio-on {
	background-position: 	-720px 50%;
}

/* checks,radios */
.button .checkbox .icon {
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.button .icon-checkbox-off,
.button .icon-radio-off {
	background-color: transparent;
}
.button .checkbox-on .icon,
.button .radio-on .icon {
	background-color: #4596ce /*{global-active-background-color}*/; /* NOTE: this hex should match the active state color. It's repeated here for cascade */
}


/* radius clip workaround for cleaning up corner trapping */
.corner-tl,
.corner-tr,
.corner-bl,
.corner-br,
.corner-top,
.corner-bottom,
.corner-right,
.corner-left,
.corner-all,
.btn-corner-tl,
.btn-corner-tr,
.btn-corner-bl,
.btn-corner-br,
.btn-corner-top,
.btn-corner-bottom,
.btn-corner-right,
.btn-corner-left,
.btn-corner-all {
  -webkit-background-clip: padding-box;
     -moz-background-clip: padding;
          background-clip: padding-box;
}