.checkbox-tick{box-sizing:border-box;--background-color:#fff;--checkbox-height:20px}.checkbox-tick-small{box-sizing:border-box;--background-color:#fff;--checkbox-height:15px}@-moz-keyframes bottom-anim{0%{height:0}to{height:calc(var(--checkbox-height) / 2)}}@-webkit-keyframes bottom-anim{0%{height:0}to{height:calc(var(--checkbox-height) / 2)}}@keyframes bottom-anim{0%{height:0}to{height:calc(var(--checkbox-height) / 2)}}@keyframes topanim{0%{height:0}50%{height:0}to{height:calc(var(--checkbox-height) * 1.2)}}@-webkit-keyframes topanim{0%{height:0}50%{height:0}to{height:calc(var(--checkbox-height) * 1.2)}}@-moz-keyframes topanim{0%{height:0}50%{height:0}to{height:calc(var(--checkbox-height) * 1.2)}}.checkbox-tick input[type=checkbox]{display:none}.checkbox-tick .check-box{height:var(--checkbox-height);width:var(--checkbox-height);background-color:transparent;border:calc(var(--checkbox-height) * .05) solid #d1d5dc;position:relative;-moz-transition:border-color .2s ease;-o-transition:border-color .2s ease;-webkit-transition:border-color .2s ease;transition:border-color .2s ease;cursor:pointer}.checkbox-tick .check-box,.checkbox-tick .check-box:after,.checkbox-tick .check-box:before{border-radius:5px;display:inline-block;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.checkbox-tick .check-box:after,.checkbox-tick .check-box:before{position:absolute;height:0;width:calc(var(--checkbox-height) * .2);background-color:black;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;-webkit-transform-origin:left top;transform-origin:left top;content:" ";-webkit-transition:opacity .5 ease;-moz-transition:opacity .5 ease;transition:opacity .5 ease}.checkbox-tick .check-box:before{top:calc(var(--checkbox-height) * .72);left:calc(var(--checkbox-height) * .41);box-shadow:0 0 0 calc(var(--checkbox-height) * .05) var(--background-color);-moz-transform:rotate(-135deg);-ms-transform:rotate(-135deg);-o-transform:rotate(-135deg);-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.checkbox-tick .check-box:after{top:calc(var(--checkbox-height) * .37);left:calc(var(--checkbox-height) * .05);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.checkbox-tick .check-box.checked,.checkbox-tick input[type=checkbox]:checked+.check-box{border-color:#d1d5dc}.checkbox-tick .check-box.checked:after,.checkbox-tick input[type=checkbox]:checked+.check-box:after{height:calc(var(--checkbox-height) / 2);-moz-animation:bottom-anim .2s ease 0s forwards;-o-animation:bottom-anim .2s ease 0s forwards;-webkit-animation:bottom-anim .2s ease 0s forwards;animation:bottom-anim .2s ease 0s forwards}.checkbox-tick .check-box.checked:before,.checkbox-tick input[type=checkbox]:checked+.check-box:before{height:calc(var(--checkbox-height) * 1.2);-moz-animation:topanim .4s ease 0s forwards;-o-animation:topanim .4s ease 0s forwards;-webkit-animation:topanim .4s ease 0s forwards;animation:topanim .4s ease 0s forwards}