@font-face {
  font-family: 'glyphicons-halflings-regular';
  src:url('../fonts/glyphicons-halflings-regular.eot');
  src:url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/glyphicons-halflings-regular.woff') format('woff'),
    url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),
    url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflings-regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

div.cs-skin-border {
	background: #cbcbcb;
	font-size: 14px;
	max-width: 100%;
}

@media screen and (max-width: 30em) {
	div.cs-skin-border { font-size: 1em; }
}

.cs-skin-border > span {
	border: none;
	border-color: inherit;
	-webkit-transition: background 0.2s, border-color 0.2s;
	transition: background 0.2s, border-color 0.2s;
}

.cs-skin-border > span::after,
.cs-skin-border .cs-selected span::after {
	font-family: 'glyphicons-halflings-regular';
	content: '\E114';
}

.cs-skin-border ul span::after {
	content: '';
	opacity: 0;
}

.cs-skin-border .cs-selected span::after {
	content: '\E113';
	color: #444;
	font-size: 14px;
	opacity: 1;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

.cs-skin-border.cs-active > span {
	background: #cbcbcb;
	color: #444;
}

.cs-skin-border .cs-options {
	color: #444;
	font-size: 14px;
	opacity: 0;
	-webkit-transition: opacity 0.2s, visibility 0s 0.2s;
	transition: opacity 0.2s, visibility 0s 0.2s;
}

.cs-skin-border.cs-active .cs-options {
	opacity: 1;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

.cs-skin-border ul span {
	padding: 6px 12px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.cs-skin-border .cs-options li span:hover,
.cs-skin-border li.cs-focus span {
	background: #d90000;
	color:#fff;

}

.cs-skin-border .cs-options li.avatar-select-li span{
	background-size: 52px 64px !important;
	padding:24px 0px 24px 0px !important;
	background-position: center center !important;
}

.cs-skin-border .cs-options li.avatar_01 span {	background: url('../images/avatar/avatar_1.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_02 span {	background: url('../images/avatar/avatar_2.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_03 span {	background: url('../images/avatar/avatar_3.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_04 span {	background: url('../images/avatar/avatar_4.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_05 span {	background: url('../images/avatar/avatar_5.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_06 span {	background: url('../images/avatar/avatar_6.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_07 span {	background: url('../images/avatar/avatar_7.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_08 span {	background: url('../images/avatar/avatar_8.png') no-repeat;}
.cs-skin-border .cs-options li.avatar_00 span {	background: url('../images/avatar/avatar_0.png') no-repeat;}
 
.avatar-select-li > span:hover,
.avatar-select-li > .cs-focus span {
	color:#d90000 !important;
}

.avatar-select-li {float:left; width:33.33%; overflow:hidden; text-indent:-300px;}
.cs-options:after {clear:both;}
li.cs-selected {background-color:#eee !important;}