.switcher {cursor: pointer; font-size: 12px; display: inline-block; *display: inline; *zoom: 1;}
.switcher .content {position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.switcher .content .position{background-image: url('red.png'); height: 11px; width: 32px; position: absolute; margin-top: 6px; margin-left:6px;}
.switcher.is-active .content .position{background-image: url('green.png');}
.switcher .text {display: none; overflow: hidden; text-align: center; white-space: nowrap;}
.switcher.is-disabled {opacity: 0.4;}
.switcher.default {min-width: 44px;}
.switcher.default input {display: none;}
.switcher.default .slider {background-image: url('button.png'); height: 22px; left: 0; position: absolute; top: 0; -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); -webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; width: 22px; z-index: 2;}
.switcher.default .text {width: 50%; display: inline-block; *display: inline; *zoom: 1;}
.switcher.default .textYes {color: white; float: left;}
.switcher.default .textNo {color: #9f9f9f; float: right;}
.switcher.default.is-active {background-color: #519b20;}
.switcher.default.is-active .slider {-webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%);}
.switcher.short {cursor: pointer; display: inline-block; margin-right: 5px; vertical-align: middle;}
.switcher.short input {display: none;}
.switcher.short .content {border: 1px solid #aaaaaa; border-radius: 50%; height: 18px; padding: 0; width: 18px;}
.switcher.short .slider {background-color: #519b20; border-radius: 50%; height: 12px; margin: 3px; opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all 0.2s; transition: all 0.2s; width: 12px;}
.switcher.short.is-active .slider {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}