
.toggle-radio {font-family:'Helvetica'; font-size:0.9rem;}

.toggle-radio > input + label {background:#f5f5f5; border:1px solid rgba(0, 0, 0, 0.2); border-width:1px 1px 0 1px;}
.toggle-radio > input:last-of-type + label {border-bottom-width:1px; border-right-width:1px;}

.toggle-radio {display:inline-block; vertical-align:middle;}
.toggle-radio > input[type='radio'] {display:none;}
.toggle-radio > input[disabled] + label {opacity:0.50; background:#f5f5f5;}
.toggle-radio > input[disabled] + label:hover {cursor:not-allowed;}
.toggle-radio > input + label {display:inline-block; float:left; border-width:1px 0 1px 1px; box-shadow: 0px 3px 10px -2px rgba(161, 170, 166, 0.7); margin-bottom:0; padding:8px 10px 8px 10px; cursor:pointer; align-items:center;}  /* JPOR */

/* Transitions */
.toggle-radio > input:checked + label {transition:background 300ms linear;}

/* Rounded */
.toggle-radio[data-style='rounded'] > input:first-of-type + label {border-radius:500px 0 0 500px;}
.toggle-radio[data-style='rounded'] > input:last-of-type + label {border-radius:0 500px 500px 0;}

.radio2:hover { background:#ddd;}
.radio3a:hover { background:#ddd;}
.radio3b:hover { background:#ddd;}
.radio4:hover { background:#ddd;}

input:checked + label.radio2 { background:#3ca1b7; color:white; text-shadow: 0.9px 0.9px 0 rgba(0, 0, 0, 0.25); border-bottom: 3px ridge #6ddff7; padding-bottom: 6px;}
input:checked + label.radio3a {background:#d84442; color:white; text-shadow: 0.9px 0.9px 0 rgba(0, 0, 0, 0.25); border-bottom: 3px ridge #fa7573; padding-bottom: 6px;}
input:checked + label.radio3b {background:#ffa500; color:white; text-shadow: 0.9px 0.9px 0 rgba(0, 0, 0, 0.25); border-bottom: 3px ridge #fae17f; padding-bottom: 6px;}
input:checked + label.radio4 { background:#52993a; color:white; text-shadow: 0.9px 0.9px 0 rgba(0, 0, 0, 0.25); border-bottom: 3px ridge #7df255; padding-bottom: 6px;}

