Cacher is the code snippet organizer for pro developers

.switch_highesthetic label input {
       margin-right:100px;
    }

    .switch_highesthetic {
        margin:4px;
        background-color:#EFEFEF;
        border-radius:4px;
        border:1px solid #D0D0D0;
        overflow:auto;
        float:left;
    }

    .switch_highesthetic label {
        float:left;
        width:90px;
        margin-bottom:0
    }

    .switch_highesthetic label span {
        text-align:center;
        padding:3px 0px;
        display:block;
    }

    .switch_highesthetic label input {
        position:absolute;
        top:-20px;
    }

    .switch_highesthetic input:checked + span {
        background-color:#0076A3;
        color:#fff;
    }
    

<script id="id-high-esthetic-template" type="text/x-kendo-template">
    #if(typeValue != 'STIFT'){#
    <div class="switch_highesthetic">       
        <label id="lbIsHighEsthetic_#:data.uid#" for="cbIsHighEsthetic_#:data.uid#">
            <input type="checkbox" name="cbIsHighEsthetic_#:data.uid#" id="cbIsHighEsthetic_#:data.uid#" data-kendo data-role="checkbox" data-bind="checked: isHighEsthetic, events:{change: onIsHighEstheticChange}" #=isHighEsthetic ? checked='checked' : '' # />
            #if(isHighEsthetic){#
                <span>high esthetic</span>
            #}else{#
                <span>normal</span>
            #}#
        </label>        
    </div>
    #}#
</script>