.form-horizontal .radio{margin-bottom:10px}
.radio label{cursor:pointer;padding-left:45px;position:relative}
.radio label span{display:block;position:absolute;left:10px;top:2px;transition-duration:.2s}
.radio label .circle{border:2px solid rgba(0,0,0,0.84);height:15px;width:15px;border-radius:100%}
.radio label .check{height:15px;width:15px;border-radius:100%;background-color:rgba(0,0,0,0.84);-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}
.radio label .check:after{display:block;position:absolute;content:"";background-color:rgba(0,0,0,0.84);left:-18px;top:-18px;height:50px;width:50px;border-radius:100%;z-index:1;opacity:0;margin:0;-webkit-transform:scale(1.5);-ms-transform:scale(1.5);transform:scale(1.5)}
.radio label input[type=radio]:not(:checked) ~ .check:after{-webkit-animation:rippleOff 500ms;animation:rippleOff 500ms}
.radio label input[type=radio]:checked ~ .check:after{-webkit-animation:rippleOn 500ms;animation:rippleOn 500ms}
.radio input[type=radio]:checked ~ .check,.radio-default input[type=radio]:checked ~ .check{background-color:rgba(0,0,0,0.84)}
.radio input[type=radio][disabled] ~ .check,.radio input[type=radio][disabled] ~ .circle{opacity:.5}
.radio input[type=radio]{display:none}
.radio input[type=radio]:checked ~ .check{-webkit-transform:scale(0.55);-ms-transform:scale(0.55);transform:scale(0.55)}
.radio input[type=radio][disabled] ~ .circle{border-color:rgba(0,0,0,0.84)}
.radio input[type=radio][disabled] ~ .check{background-color:rgba(0,0,0,0.84)}
@keyframes rippleOn {
0%{opacity:0}
50%{opacity:.2}
100%{opacity:0}
}
@keyframes rippleOff {
0%{opacity:0}
50%{opacity:.2}
100%{opacity:0}
}
.form-horizontal .checkbox{padding-top:20px}
.checkbox label{padding-left:10px;cursor:pointer;position:relative}
.checkbox label span{display:block;position:absolute;left:0;transition-duration:.2s}
.checkbox label .ripple{display:block;position:absolute;content:"";background-color:rgba(0,0,0,0.84);left:-8px;top:-11px;height:50px;width:50px;border-radius:100%;z-index:1;opacity:0;margin:0}
.checkbox.circle label .ripple{display:block;position:absolute;content:"";background-color:rgba(0,0,0,0.84);left:1px;top:-14px;height:39px;width:39px;border-radius:100%;z-index:1;opacity:0;margin:0}
.checkbox.circle label{color:#a8a7a7;font-size:9.5px;font-family:Arial}
.checkbox label input[type=checkbox]:not(:checked) ~ .ripple{-webkit-animation:rippleOff 500ms;animation:rippleOff 500ms}
.checkbox label input[type=checkbox]:checked ~ .ripple{-webkit-animation:rippleOn 500ms;animation:rippleOn 500ms}
.checkbox label .check{display:inline-block;width:16px;height:16px;border:2px solid;border-radius:2px;overflow:hidden;position:relative;top:3px;margin-right:5px}
.checkbox.circle label .check{display:inline-block;width:9px;height:9px;border:none;border-radius:50px;overflow:hidden;position:relative;top:0;left:-3px;margin-right:11px;background:#a8a7a7}
.checkbox label .check:after{display:block;position:absolute;content:"";background-color:rgba(0,0,0,0.84);left:-5px;top:-15px;height:50px;width:50px;border-radius:100%;z-index:1;opacity:0;margin:0}
.checkbox.circle label .check:after{display:block;position:absolute;content:"";background-color:#a8a7a7;left:-5px;top:-15px;height:50px;width:50px;border-radius:100%;z-index:1;opacity:0;margin:0}
.checkbox label .check:before{position:absolute;content:"";-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);display:block;margin-top:-6px;margin-left:5px;width:0;height:0;box-shadow:0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0 inset;-webkit-animation:checkbox-off .3s linear forwards;animation:checkbox-off .3s linear forwards}
.checkbox input[type=checkbox]{opacity:0}
.checkbox input[type=checkbox]:focus ~ .check:after{opacity:.2}
.checkbox input[type=checkbox]:checked ~ .check:before{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px;-webkit-animation:checkbox-on .3s linear forwards;animation:checkbox-on .3s linear forwards}
.checkbox input[type=checkbox]:not(:checked) ~ .check:after{-webkit-animation:rippleOff 500ms linear forwards;animation:rippleOff 500ms linear forwards}
.checkbox input[type=checkbox]:checked ~ .check:after{-webkit-animation:rippleOn 500ms linear forwards;animation:rippleOn 500ms linear forwards}
.checkbox:not(:hover) input[type=checkbox] ~ .check:before,.checkbox:not(:hover) input[type=checkbox] ~ .check:after{-webkit-animation-duration:1ms;animation-duration:1ms}
.checkbox input[type=checkbox][disabled]:not(:checked) ~ .check:before,.checkbox input[type=checkbox][disabled] ~ .circle{opacity:.5}
.checkbox input[type=checkbox][disabled] ~ .check:after{background-color:rgba(0,0,0,0.84);-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}
.checkbox input[type=checkbox]:checked ~ .check:after,.checkbox-default input[type=checkbox]:checked ~ .check:after{background-color:#f39b16}
.checkbox input[type=checkbox] ~ .check,.checkbox-default input[type=checkbox] ~ .check {border-radius:0}
@-webkit-keyframes checkbox-on {
0%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,15px 2px 0 11px}
50%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px 2px 0 11px}
100%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px}
}
@keyframes checkbox-on {
0%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,15px 2px 0 11px}
50%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px 2px 0 11px}
100%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px}
}
@-webkit-keyframes checkbox-off {
0%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px,0 0 0 0 inset}
25%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px,0 0 0 0 inset}
50%{-webkit-transform:rotate(45deg);transform:rotate(45deg);margin-top:-4px;margin-left:6px;width:0;height:0;box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,15px 2px 0 11px,0 0 0 0 inset}
51%{-webkit-transform:rotate(0deg);transform:rotate(0deg);margin-top:-2px;margin-left:-2px;width:20px;height:20px;box-shadow:0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 10px inset}
100%{-webkit-transform:rotate(0deg);transform:rotate(0deg);margin-top:-2px;margin-left:-2px;width:20px;height:20px;box-shadow:0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0 inset}
}
@keyframes checkbox-off {
0%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px,0 0 0 0 inset}
25%{box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,20px -12px 0 11px,0 0 0 0 inset}
50%{-webkit-transform:rotate(45deg);transform:rotate(45deg);margin-top:-4px;margin-left:6px;width:0;height:0;box-shadow:0 0 0 10px,10px -10px 0 10px,32px 0 0 20px,0 32px 0 20px,-5px 5px 0 10px,15px 2px 0 11px,0 0 0 0 inset}
51%{-webkit-transform:rotate(0deg);transform:rotate(0deg);margin-top:-2px;margin-left:-2px;width:20px;height:20px;box-shadow:0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 10px inset}
100%{-webkit-transform:rotate(0deg);transform:rotate(0deg);margin-top:-2px;margin-left:-2px;width:20px;height:20px;box-shadow:0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0,0 0 0 0 inset}
}
@-webkit-keyframes rippleOn {
0%{opacity:0}
50%{opacity:.2}
100%{opacity:0}
}
@keyframes rippleOn {
0%{opacity:0}
50%{opacity:.2}
100%{opacity:0}
}
@-webkit-keyframes rippleOff {
0%{opacity:0}
50%{opacity:.2}
100%{opacity:0}
}
@keyframes rippleOff {
0%{opacity:0}
50%{opacity:.2}
100%{opacity:0}
}