Material Checkbox without Material

The main HTML is very simple, having just two key elements input and span.

<label>
	<input type="checkbox" />
	<span class="checkbox"></span>
</label>

In order to create the checkmark it is nothing more than a bottom, and left border colored green. The key here is that it is then rotated 45deg to make it look like a check mark.

input:checked ~ .checkbox {
	transform: rotate(45deg);
	height: 125px;
	width: 50px;
	margin-left: 50px;
	border-color: green;
	border-top-color: transparent;
	border-left-color: transparent;
	border-radius: 0;
}