.checkbox-container{box-sizing:border-box;padding:25px;text-align:center}.checkbox-container h2{margin-bottom:40px}.checkbox-container p{margin-top:40px}@-moz-keyframes dothabottomcheck{0%{height:0}to{height:12.5px}}@-webkit-keyframes dothabottomcheck{0%{height:0}to{height:12.5px}}@keyframes dothabottomcheck{0%{height:0}to{height:12.5px}}@keyframes dothatopcheck{0%{height:0}50%{height:0}to{height:30px}}@-webkit-keyframes dothatopcheck{0%{height:0}50%{height:0}to{height:30px}}@-moz-keyframes dothatopcheck{0%{height:0}50%{height:0}to{height:30px}}input[type=checkbox]{display:none}.check-box{height:25px;width:25px;background-color:transparent;border:2.5px solid #4a3399;border-radius:5px;position:relative;-moz-transition:border-color ease .2s;-o-transition:border-color ease .2s;-webkit-transition:border-color .2s ease;transition:border-color .2s ease;cursor:pointer}.check-box,.check-box:after,.check-box:before{display:inline-block;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.check-box:after,.check-box:before{position:absolute;height:0;width:5px;background-color:#34b93d;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;-webkit-transform-origin:left top;transform-origin:left top;border-radius:5px;content:" ";-webkit-transition:opacity .5 ease;-moz-transition:opacity ease .5;transition:opacity .5 ease}.check-box:before{top:18px;left:10.25px;box-shadow:0 0 0 1.25px var(--bg-color);-moz-transform:rotate(-135deg);-ms-transform:rotate(-135deg);-o-transform:rotate(-135deg);-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.check-box:after{top:9.25px;left:1.25px;-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.check-box.checked,input[type=checkbox]:checked+.check-box{border-color:#4a3399}.check-box.checked:after,input[type=checkbox]:checked+.check-box:after{height:12.5px;-moz-animation:dothabottomcheck .2s ease 0s forwards;-o-animation:dothabottomcheck .2s ease 0s forwards;-webkit-animation:dothabottomcheck .2s ease 0s forwards;animation:dothabottomcheck .2s ease 0s forwards}.check-box.checked:before,input[type=checkbox]:checked+.check-box:before{height:30px;-moz-animation:dothatopcheck .4s ease 0s forwards;-o-animation:dothatopcheck .4s ease 0s forwards;-webkit-animation:dothatopcheck .4s ease 0s forwards;animation:dothatopcheck .4s ease 0s forwards}