.checkbox
{
border-radius: 6px;
float: left;
margin: 0 -28px 0 0;
padding: 0;
position: relative;
opacity: 0;
height: 28px;
width: 28px;
z-index: -1;
}

.checkbox + label
{
display: inline-block;
font-family: inherit;
font-weight: inherit;
line-height: 28px;
min-height: 28px;
margin: 0;
padding: 0 0 0 40px;
position: relative;
}

.checkbox + label:before
{
background-color: #fbfbfb;
background-image: none;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;

border-color: #d3d3d3;
border-style: solid;
border-width: 1px;

border-radius: 6px;
content: "";
display: block;
margin: 0;
overflow: hidden;
padding: 0;
position: absolute;
top: 0;
left: 0;
height: 26px;
width: 26px;
/*z-index: 1;*/

-webkit-transition: all 0.25s linear;
   -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
     -o-transition: all 0.25s linear;
        transition: all 0.25s linear;
}

.checkbox:focus + label:before,
.checkbox + label:hover:before
{
border-color: #9e9e9e;
}

.checkbox:checked + label:before
{
background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" version="1.1"><path fill="%2332bc00" d="m 23.593557,7.5646317 3.37632,3.3763243 -10.128517,10.118088 -3.37632,3.376324 -3.36544,-3.376324 -5.069477,-5.059045 3.37632,-3.376323 5.059052,5.059045 10.128062,-10.1180893 0,0 z" /></svg>');
}

.checkbox:disabled
{
pointer-events: none;
}

.checkbox:disabled + label
{
cursor: not-allowed;
}

.checkbox:disabled + label:before
{
background-color: #e7e7e7;
border-color: #d3d3d3;
cursor: not-allowed;

-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
        filter: grayscale(100%);
}

.checkbox:checked:disabled + label:before
{

}

.checkbox.checkbox-xxs{ height: 16px; width: 16px; border-radius: 3px; margin-right: -16px; }
.checkbox.checkbox-xs { height: 20px; width: 20px; border-radius: 4px; margin-right: -20px; }
.checkbox.checkbox-sm { height: 24px; width: 24px; border-radius: 5px; margin-right: -24px; }
.checkbox.checkbox-md { height: 28px; width: 28px; border-radius: 6px; margin-right: -28px; }
.checkbox.checkbox-lg { height: 32px; width: 32px; border-radius: 7px; margin-right: -32px; }
.checkbox.checkbox-xl { height: 36px; width: 36px; border-radius: 8px; margin-right: -36px; }
.checkbox.checkbox-xxl{ height: 40px; width: 40px; border-radius: 9px; margin-right: -40px; }

.checkbox.checkbox-xxs+ label { line-height: 16px; min-height: 16px; padding-left: 28px; }
.checkbox.checkbox-xs + label { line-height: 20px; min-height: 20px; padding-left: 32px; }
.checkbox.checkbox-sm + label { line-height: 24px; min-height: 24px; padding-left: 36px; }
.checkbox.checkbox-md + label { line-height: 28px; min-height: 28px; padding-left: 40px; }
.checkbox.checkbox-lg + label { line-height: 32px; min-height: 32px; padding-left: 44px; }
.checkbox.checkbox-xl + label { line-height: 36px; min-height: 36px; padding-left: 48px; }
.checkbox.checkbox-xxl+ label { line-height: 40px; min-height: 40px; padding-left: 52px; }

.checkbox.checkbox-xxs+ label:before	{ height: 14px; width: 14px; border-radius: 3px; }
.checkbox.checkbox-xs + label:before	{ height: 18px; width: 18px; border-radius: 4px; }
.checkbox.checkbox-sm + label:before	{ height: 22px; width: 22px; border-radius: 5px; }
.checkbox.checkbox-md + label:before	{ height: 26px; width: 26px; border-radius: 6px; }
.checkbox.checkbox-lg + label:before	{ height: 30px; width: 30px; border-radius: 7px; }
.checkbox.checkbox-xl + label:before	{ height: 34px; width: 34px; border-radius: 8px; }
.checkbox.checkbox-xxl+ label:before	{ height: 38px; width: 38px; border-radius: 9px; }





.checkbox.checkbox-multiline,
.checkbox.checkbox-multiline + label
{
line-height: 22px;
padding-top: 3px;
padding-bottom: 3px;
}

.checkbox.checkbox-multiline.checkbox-xxs, .checkbox.checkbox-multiline.checkbox-xxs+ label	{ padding-top: 0px; padding-bottom: 0px; }
.checkbox.checkbox-multiline.checkbox-xs,  .checkbox.checkbox-multiline.checkbox-xs + label	{ padding-top: 0px; padding-bottom: 0px; }
.checkbox.checkbox-multiline.checkbox-sm,  .checkbox.checkbox-multiline.checkbox-sm + label	{ padding-top: 1px; padding-bottom: 1px; }
.checkbox.checkbox-multiline.checkbox-md,  .checkbox.checkbox-multiline.checkbox-md + label	{ padding-top: 3px; padding-bottom: 3px; }
.checkbox.checkbox-multiline.checkbox-lg,  .checkbox.checkbox-multiline.checkbox-lg + label	{ padding-top: 5px; padding-bottom: 5px; }
.checkbox.checkbox-multiline.checkbox-xl,  .checkbox.checkbox-multiline.checkbox-xl + label	{ padding-top: 7px; padding-bottom: 7px; }
.checkbox.checkbox-multiline.checkbox-xxl, .checkbox.checkbox-multiline.checkbox-xxl+ label	{ padding-top: 9px; padding-bottom: 9px; }



.checkbox.checkbox-vcenter,
.checkbox.checkbox-vcenter + label:before
{
margin-top: -14px;
top: 50%;
}

.checkbox.checkbox-vcenter.checkbox-xxs, .checkbox.checkbox-vcenter.checkbox-xxs+ label:before	{ margin-top:  -8px; }
.checkbox.checkbox-vcenter.checkbox-xs,  .checkbox.checkbox-vcenter.checkbox-xs + label:before	{ margin-top: -10px; }
.checkbox.checkbox-vcenter.checkbox-sm,  .checkbox.checkbox-vcenter.checkbox-sm + label:before	{ margin-top: -12px; }
.checkbox.checkbox-vcenter.checkbox-md,  .checkbox.checkbox-vcenter.checkbox-md + label:before	{ margin-top: -14px; }
.checkbox.checkbox-vcenter.checkbox-lg,  .checkbox.checkbox-vcenter.checkbox-lg + label:before	{ margin-top: -16px; }
.checkbox.checkbox-vcenter.checkbox-xl,  .checkbox.checkbox-vcenter.checkbox-xl + label:before	{ margin-top: -18px; }
.checkbox.checkbox-vcenter.checkbox-xxl, .checkbox.checkbox-vcenter.checkbox-xxl+ label:before	{ margin-top: -20px; }





.checkbox + label:empty
{
padding-left: 0;
}

.checkbox.checkbox-block + label
{
display: block;
}

.checkbox + label + .checkbox + label
{
margin-left: 24px;
}




html[dir="rtl"] .checkbox					{ float: right; margin: 0 0 0 -28px; }
html[dir="rtl"] .checkbox + label			{ padding: 0 40px 0 0; }
html[dir="rtl"] .checkbox + label:before	{ left: auto; right: 0; }

html[dir="rtl"] .checkbox.checkbox-xxs{ margin-left: -16px; }
html[dir="rtl"] .checkbox.checkbox-xs { margin-left: -20px; }
html[dir="rtl"] .checkbox.checkbox-sm { margin-left: -24px; }
html[dir="rtl"] .checkbox.checkbox-md { margin-left: -28px; }
html[dir="rtl"] .checkbox.checkbox-lg { margin-left: -32px; }
html[dir="rtl"] .checkbox.checkbox-xl { margin-left: -36px; }
html[dir="rtl"] .checkbox.checkbox-xxl{ margin-left: -40px; }

html[dir="rtl"] .checkbox.checkbox-xxs+ label { padding-right: 28px; }
html[dir="rtl"] .checkbox.checkbox-xs + label { padding-right: 32px; }
html[dir="rtl"] .checkbox.checkbox-sm + label { padding-right: 36px; }
html[dir="rtl"] .checkbox.checkbox-md + label { padding-right: 40px; }
html[dir="rtl"] .checkbox.checkbox-lg + label { padding-right: 44px; }
html[dir="rtl"] .checkbox.checkbox-xl + label { padding-right: 48px; }
html[dir="rtl"] .checkbox.checkbox-xxl+ label { padding-right: 52px; }



.checkbox:indeterminate + label:before
{
background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" version="1.1"><rect fill="%2332bc00" width="22.44" height="4.78" x="4.78" y="13.61" /></svg>');
}




.checkbox + label:empty
{
margin: 0 !important;
padding: 0 !important;
width: 20px !important;
}

