.sun {background:#8E8E8E;}
.sun:checked {background:#00C350;}
/* .sun:hover {background:#00C350;} */
.sun:active {background: #00722D;}

.circles {
    position:relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    width:30px;
    height:30px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    cursor: pointer;
    margin-left: 10px;
  }
  
  .circles:after {
    position:absolute;
    left:3px;
    top:5px;
    content:"";
    background:url('https://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png');
    background-position:-23px;
    width:22px;
    height:22px;
  }
  
  .circles:checked:after {
    position:absolute;
    left:3px;
    top:5px;
    content:"";
    background:url('https://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png');
    background-position:-23px;
    width:22px;
    height:22px;
  }