/* on Off button css */

    .switch
    {
        position: relative;
        display: inline-block;
        width: 35px;
        height: 20px;
    }   
    .switch input
    {
        opacity: 0;
    }   
    .slider
    {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: .4s;
        transition: .4s;
    }   
    .slider:before
    {
        position: absolute;
        content: "";
        height: 12px;
        width: 12px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }   
    input:checked + .slider
    {
        background-color: #2196F3;
    }   
    input:focus + .slider
    {
        box-shadow: 0 0 1px #2196F3;
    }   
    input:checked + .slider:before
    {
        -webkit-transform: translateX(16px);
        -ms-transform: translateX(16px);
        transform: translateX(16px);
    }   
    /* Rounded sliders */
    .slider.round
    {
        border-radius: 34px;
    }   
    .slider.round:before
    {
        border-radius: 50%;
    }
       
/* End on Off button css */