input[type=checkbox].button-it,
input[type=radio].button-it {
    display: none !important;
}

input.button-it + label {
    padding: 7px;
    font-size: 12px;
    background-color: #e5e5e5;
    color: #a8a8a8;
    cursor: pointer;
    display: inline-flex;
    white-space: nowrap;
    align-items: center;
    -webkit-align-items: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: background-color .3s;
    -moz-transition: background-color .3s;
    -ms-transition: background-color .3s;
    -o-transition: background-color .3s;
    transition: background-color .3s;
}

input.button-it + label {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}


input.button-it:not(:checked) + label > span.checked-message,
input.button-it:checked + label > span.unchecked-message
{
	display: none;
}

input.button-it:not(:checked) + label > span.unchecked-message,
input.button-it:checked + label > span.checked-message
{
	display: block;
}

input.button-it:not(:checked):not([disabled]) + label:hover
{
	background-color: #eaeaea;
	color: #a7a7a7;
}

input.button-it.tart-orange:checked + label {
    background-color: #FB4B4E;
    color: #fff;
}
input.button-it.summer-sky:checked + label
{
	background-color: #3498db;
	color: #ffffff;
}
input.button-it.turquoise:checked + label {
    background-color: #41d3bd;
    color: #fff;
}
input.button-it.mikado-yellow:checked + label {
    background-color: #f9c80e;
    color: #fff;
}
input.button-it.spanish-orange:checked + label {
    background-color: #d96c06;
    color: #fff;
}
input.button-it.apple-green:checked + label {
    background-color: #8ea604;
    color: #fff;
}
input.button-it.artichoke:checked + label {
    background-color: #90a583;
    color: #fff;
}
input.button-it.pink-lavender:checked + label {
    background-color: #d1b1cb;
    color: #fff;
}
input.button-it.smoky-black:checked + label {
    background-color: #0f0a0a;
    color: #fff;
}
input.button-it:checked:not([disabled]) + label:hover
{
    opacity: 0.8;
}
input.button-it.night-fade:checked + label {
    background-color: #a18cd1;
    background-image: linear-gradient(to right, #a18cd1 0%, #fbc2eb 100%);
    color: #fff;
}
input.button-it.dusty-grass:checked + label {
    background-color: #d4fc79;
    background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%);
    color: #000;
}
input.button-it.malibu-beach:checked + label {
    background-color: #4facfe;
    background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
    color: #2d6392;
}
input.button-it.premium-white:checked + label {
    background-color: #d5d4d0;
    background-image: linear-gradient(to right, #d5d4d0 0%, #d5d4d0 1%, #eeeeec 31%, #efeeec 75%, #e9e9e7 100%);
    color: #000;
}
input.button-it.smart-indigo:checked + label {
    background-color: #b224ef;
    background-image: linear-gradient(to right, #b224ef 0%, #7579ff 100%);
    color: #fff;
}