		/* 
			 * The state classes are a little bit complex, because of the doubble class bug in IE6
			 * The state class looks like this:
			 * 
			 * .ui-radio-state[-checked][-disabled][-hover] or .ui-checkbox-state[-checked][-disabled][-hover]
			 * 
			 * Examples:
			 * 
			 * .ui-radio-state-checked (simply checked) 
			 * .ui-radio-state-checked-hover (checked and hovered/focused)
			 * .ui-radio-state-hover (unchecked and hovered/focused)
			 * 
			 * If you don´t have to deal with the doubble class bug of IE6 you can also use the simple ui-checkbox-checked, ui-checkbox-disabled, ui-checkbox-hover state-classnames (or: ui-radio-checked...)
			 * and the ui-radio/ui-checkbox role-classnames.
			 * 
			 */
			
			.ui-radio-state-disabled,
			.ui-radio-state-checked-disabled,
			.ui-radio-state-disabled-hover,
			.ui-radio-state-checked-disabled-hover {
				color: #999;
			}
			
			span.ui-checkbox,
			span.ui-radio {
				display: block;
				float: left;
				width: 26px;
				height: 20px;
				background: url(../images/icon_checkbox.png) 0 -30px no-repeat;
			}
			span.ui-radio {
				background: url(../images/icon_checkbox.png) 0 -150px no-repeat;
			}
			
			span.ui-helper-hidden {
				display: none;
			}
			
			label {
				padding: 2px;
				
			}
			span.ui-radio-state-hover {
				background-position: 0 -210px;
			}
			span.ui-checkbox-state-hover {
				background-position: 0 -90px;
			}
			
			span.ui-checkbox-state-checked {
				background-position: 0 0;
			}
			
			span.ui-checkbox-state-checked-hover {
				background-position: 0 -60px;
			}
			span.ui-radio-state-checked-disabled-hover,
			span.ui-radio-state-checked-disabled,
			span.ui-radio-state-checked {
				background-position: 0 -120px;
			}
			
			span.ui-radio-state-checked-hover {
				background-position: 0 -180px;
			}
			.ui-radio-disabled,
			.ui-checkbox-disabled {
				opacity: 0.7;
			}
			
			.ui-helper-hidden-accessible {
				position: absolute;
				left: -999em;
			}
			
			.checkergroup_cn {
				position:relative;
				display:inline-block;
				width:300px;
				vertical-align:top;
			}
			fieldset.checkergroup_cn {
				margin-bottom:0;
			}
			.checkergroup {
				position:relative;
				display:block;
				width:100%;
				margin-top:5px;
				margin-bottom:15px;
				vertical-align:top;
			}
			.checkergroup legend {
				width:100%;
				font-weight:bold;
			}
			.checkergroup label {
				width:100%;
				font-weight:normal;
				color:#333;
			}
			
			.checkergroup_cn button {
	background: #f9f9f9; /* Old browsers */
	background: -moz-linear-gradient(top, #f9f9f9 0%, #e1e1e1 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#e1e1e1)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f9f9f9 0%,#e1e1e1 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f9f9f9 0%,#e1e1e1 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #f9f9f9 0%,#e1e1e1 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#e1e1e1',GradientType=0 ); /* IE6-9 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99f9f9f9,endColorstr=#99e1e1e1)";
	background: linear-gradient(top, #f9f9f9 0%,#e1e1e1 100%); /* W3C */
	border-top:#c3c3c3 1px solid;
	border-bottom:#838383 1px solid;
	border-left:#b2b2b2 1px solid;
	border-right:#a1a1a1 1px solid;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	  padding: 1px 6px;
	  color: #1c1c1c;
	  display: inline-block;
	  font-size: 12px;
	  font-weight: normal;
	  text-decoration: none;
	text-shadow: 0 1px rgba(255, 255, 255, .75);
	  cursor: pointer;
	  margin-bottom: 20px;
	  line-height: 16px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(color=#3e3e3e,direction=180,strength=0)"; /* IE 8 */
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#3e3e3e,direction=180,strength=0); /* IE 7- */
	
	-moz-box-shadow: 0 0 0px 0px #3e3e3e;
    -webkit-box-shadow: 0 0 0px 0px #3e3e3e;
    -ms-filter: "progid:DXImageTransform.Microsoft.Glow(color=#666666,strength=0)";
    filter:
            progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=0,strength=0)
            progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=90,strength=0)
            progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=180,strength=0)
            progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=270,strength=0);
    box-shadow: 0 0 0px 0px #3e3e3e;
}
.checkergroup_cn button:hover {
	text-decoration:none;
	background: #eee; /* Old browsers */
	background: -moz-linear-gradient(top, #e1e1e1 0%, #f9f9f9 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e1e1e1), color-stop(100%,#f9f9f9)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #e1e1e1 0%,#f9f9f9 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #e1e1e1 0%,#f9f9f9 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #e1e1e1 0%,#f9f9f9 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e1e1e1', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99e1e1e1,endColorstr=#99f9f9f9)";
	background: linear-gradient(top, #e1e1e1 0%,#f9f9f9 100%); /* W3C */
}
