/* 
    Created on : Feb 3, 2023, 1:23:41 PM
    Author     : rvizuet
*/

input[type=checkbox] 
    {
    visibility: hidden;
    }

.checkbox-slider 
    {
    width: 27px;
    height: 17px;
    background: #88AABB;
    margin: 1px 1px;
    position: relative;
    border-radius: 15px;
    }

.checkbox-slider label 
    {
    display: block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    transition: all .5s ease;
    cursor: pointer;
    position: absolute;
    top: 0px;
    left: 0px;
    background: #DDDDDD;
    border: 1px solid #003366;
    }

.checkbox-slider input[type=checkbox]:checked + label 
    {
    left: 12px;
    background: #003366;
    }