/* input[type=checkbox].mailtpl-toggle {
    display: none;
}
input[type=checkbox].mailtpl-toggle, input[type=checkbox].mailtpl-toggle:after, input[type=checkbox].mailtpl-toggle:before, input[type=checkbox].mailtpl-toggle *, input[type=checkbox].mailtpl-toggle *:after, input[type=checkbox].mailtpl-toggle *:before, input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn {
    box-sizing: border-box;
}
input[type=checkbox].mailtpl-toggle::-moz-selection, input[type=checkbox].mailtpl-toggle:after::-moz-selection, input[type=checkbox].mailtpl-toggle:before::-moz-selection, input[type=checkbox].mailtpl-toggle *::-moz-selection, input[type=checkbox].mailtpl-toggle *:after::-moz-selection, input[type=checkbox].mailtpl-toggle *:before::-moz-selection, input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn::-moz-selection {
    background: none;
}
input[type=checkbox].mailtpl-toggle::selection, input[type=checkbox].mailtpl-toggle:after::selection, input[type=checkbox].mailtpl-toggle:before::selection, input[type=checkbox].mailtpl-toggle *::selection, input[type=checkbox].mailtpl-toggle *:after::selection, input[type=checkbox].mailtpl-toggle *:before::selection, input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn::selection {
    background: none;
}
input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn {
    outline: 0;
    display: block;
    width: 4em;
    height: 2em;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn:after, input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn:before {
    position: relative;
    display: block;
    content: "";
    width: 50%;
    height: 100%;
}
input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn:after {
    left: 0;
}
input[type=checkbox].mailtpl-toggle + .mailtpl-toggle-btn:before {
    display: none;
}
input[type=checkbox].mailtpl-toggle:checked + .mailtpl-toggle-btn:after {
    left: 50%;
}

input[type=checkbox].mailtpl-toggle-light + .mailtpl-toggle-btn {
    background: #f0f0f0;
    border-radius: 2em;
    padding: 2px;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}
input[type=checkbox].mailtpl-toggle-light + .mailtpl-toggle-btn:after {
    border-radius: 50%;
    background: #fff;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}
input[type=checkbox].mailtpl-toggle-light:checked + .mailtpl-toggle-btn {
    background: #9FD6AE;
}

input[type=checkbox].mailtpl-toggle-ios + .mailtpl-toggle-btn {
    background: #fbfbfb;
    border-radius: 2em;
    padding: 2px;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    border: 1px solid #e8eae9;
}
input[type=checkbox].mailtpl-toggle-ios + .mailtpl-toggle-btn:after {
    border-radius: 2em;
    background: #fbfbfb;
    -webkit-transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
    transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 0 rgba(0, 0, 0, 0.08);
}
input[type=checkbox].mailtpl-toggle-ios + .mailtpl-toggle-btn:hover:after {
    will-change: padding;
}
input[type=checkbox].mailtpl-toggle-ios + .mailtpl-toggle-btn:active {
    box-shadow: inset 0 0 0 2em #e8eae9;
}
input[type=checkbox].mailtpl-toggle-ios + .mailtpl-toggle-btn:active:after {
    padding-right: .8em;
}
input[type=checkbox].mailtpl-toggle-ios:checked + .mailtpl-toggle-btn {
    background: #86d993;
}
input[type=checkbox].mailtpl-toggle-ios:checked + .mailtpl-toggle-btn:active {
    box-shadow: none;
}
input[type=checkbox].mailtpl-toggle-ios:checked + .mailtpl-toggle-btn:active:after {
    margin-left: -.8em;
}

input[type=checkbox].mailtpl-toggle-flat + .mailtpl-toggle-btn {
    padding: 2px;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    background: #fff;
    border: 4px solid #f2f2f2;
    border-radius: 2em;
}
input[type=checkbox].mailtpl-toggle-flat + .mailtpl-toggle-btn:after {
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    background: #f2f2f2;
    content: "";
    border-radius: 1em;
}
input[type=checkbox].mailtpl-toggle-flat:checked + .mailtpl-toggle-btn {
    border: 4px solid #7FC6A6;
}
input[type=checkbox].mailtpl-toggle-flat:checked + .mailtpl-toggle-btn:after {
    left: 50%;
    background: #7FC6A6;
}

.disabled-control-title {
    color: #a0a5aa;
}
input[type=checkbox].mailtpl-toggle-light:checked + .mailtpl-toggle-btn {
    background: #0085ba;
}
input[type=checkbox].mailtpl-toggle-light + .mailtpl-toggle-btn {
    background: #a0a5aa;
}
input[type=checkbox].mailtpl-toggle-light + .mailtpl-toggle-btn:after {
    background: #f7f7f7;
}

input[type=checkbox].mailtpl-toggle-ios:checked + .mailtpl-toggle-btn {
    background: #0085ba;
}

input[type=checkbox].mailtpl-toggle-flat:checked + .mailtpl-toggle-btn {
    border: 4px solid #0085ba;
}
input[type=checkbox].mailtpl-toggle-flat:checked + .mailtpl-toggle-btn:after {
    background: #0085ba;
} */



/* Hide the default checkbox */
.customToggle{
    display:none!important;
}

/* Toggle switch container */
.tgl-btn {
    display: inline-block;
    width: 56px;
    height: 24px;
    background: #ccc;
    border-radius: 12px;
    position: relative;
    cursor: pointer;
    transition: background 0.3s ease;
}

/* The slider */
.tgl-btn::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 50%;
    top: 2px;
    left: 0px;
    transition: all 0.3s ease;
}

/* When checkbox is checked */
.customToggle:checked + .tgl-btn {
    background: #0085ba;
}

.customToggle:checked + .tgl-btn::before {
    transform: translateX(26px);
}