.squaredTwo {
width: 28px;
height: 28px;
position: relative;
margin: 20px auto;
background: #fcfff4;
background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.squaredTwo label {
width: 20px;
height: 20px;
cursor: pointer;
position: absolute;
left: 4px;
top: 4px;
background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px white;
}
.squaredTwo label:after {
content: '';
width: 9px;
height: 5px;
position: absolute;
top: 4px;
left: 4px;
border: 3px solid #fcfff4;
border-top: none;
border-right: none;
background: transparent;
opacity: 0;
transform: rotate(-45deg);
}
.squaredTwo label:hover::after {
opacity: 0.3;
}
.squaredTwo input[type=checkbox] {
visibility: hidden;
}
.squaredTwo input[type=checkbox]:checked + label:after {
opacity: 1;
}
