How to make a Check Button? (hidden checkbox with label as a button: CSS only)

Using method 1 to create a clickable label, hiding the checkbox with CSS and toggling it and the label with jQuery, I got this:

$('label').click(function(e) {
  $(this).toggleClass('active');
  var cbx = $('input', this);
  cbx.prop('checked', !cbx.prop("checked"));
  console.log($('input', this).prop('checked'));
  return false;
})

input[type="checkbox"] {visibility: hidden;position: absolute}
label {background-color: pink;border: 1px solid lightblue;padding: 20px}
label.active {background-color: lightgreen}

<script src="http://ift.tt/1oMJErh"></script>
<label>
  <input type="checkbox" checked />Check Button</label>

[Check the console for the checkbox status]

My question is: is it possible to do the same only using CSS?

I realize I'm using <label> not <button> and I assume there are better ways to achieve this with jQuery. If you consider replying with one, please do it using a checkbox (or at least explain why you must not use it).