.checkbox3 label::before, .radio3 label::before { overflow: hidden; vertical-align: middle; text-align: center } .checkbox3 label, .radio3 label { white-space: nowrap; cursor: pointer } .checkbox3 { position: relative } .checkbox3 input { position: absolute; left: -9999px } .checkbox3 label::after, .checkbox3 label::before { content: ''; top: 10px; bottom: 10px; left: 0; display: block } .checkbox3 label { display: block; position: relative; padding: 11px 0 11px 30px; font-size: 12px; margin-bottom: 0; margin-top: -4px } .checkbox3 label::before { position: absolute; width: 23px; height: 23px; border: 1px solid #CCC; -moz-border-radius: 1px; border-radius: 1px; -webkit-transition: background-color .2s; -moz-transition: background-color .2s; transition: background-color .2s } .checkbox3 label::after { position: absolute; width: 23px; height: 23px; border: 12px solid #FFF; margin: 1px; -webkit-transition: all 50ms; -moz-transition: all 50ms; transition: all 50ms; opacity: 0 } .checkbox3 input:checked+label::before { border-width: 1px; border-style: solid; background-color: #444; border-color: #444; color: #fff } .checkbox3 input:checked+label::after { border: 3px solid #FFF; opacity: 1 } .checkbox3.checkbox-sm label { padding: 8px 0 8px 22px } .checkbox3.checkbox-sm label::before { width: 14px; height: 14px; line-height: 14px } .checkbox3.checkbox-sm label::after { width: 12px; height: 12px } .checkbox3.checkbox-lg label { padding: 15px 0 15px 40px } .checkbox3.checkbox-lg label::before { width: 28px; height: 27px; line-height: 24px } .checkbox3.checkbox-lg label::after { width: 26px; height: 25px } .checkbox3.checkbox-inline, .radio3.radio-inline { padding-top: 0; padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0 } .checkbox3.checkbox-inline input[type=checkbox], .checkbox3.checkbox-inline input[type=radio], .radio3.radio-inline input[type=checkbox], .radio3.radio-inline input[type=radio] { position: absolute } .checkbox3.checkbox-check input:checked+label::after, .checkbox3.checkbox-check label::after { border: 0 } .checkbox3.checkbox-check label::after { content: "\f00c"; font-family: FontAwesome; font-size: 12px; color: #FFF; width: 20px; height: 23px; line-height: 20px; vertical-align: middle; text-align: center; border-width: 0 } .checkbox3.checkbox-check.checkbox-sm label::after { font-size: 9px; line-height: 12px; width: 12px } .checkbox3.checkbox-check.checkbox-lg label::after { font-size: 16px; line-height: 26px; width: 26px } .checkbox3.checkbox-check.checkbox-light label::after { color: #0c6dc3 } .checkbox3.checkbox-circle label::after, .checkbox3.checkbox-circle label::before { -moz-border-radius: 20px; border-radius: 20px } .checkbox3.checkbox-round label::after, .checkbox3.checkbox-round label::before, .checkbox3.checkbox-s1 label::after, .checkbox3.checkbox-s1 label::before { -moz-border-radius: 4px; border-radius: 4px } .checkbox3.checkbox-light label::before { background-color: transparent } .checkbox3.checkbox-light input:checked+label::before { background-color: transparent; border-color: #0c6dc3 } .checkbox3.checkbox-info input:checked+label::before { background-color: #2caef5; border-color: #2caef5 } .checkbox3.checkbox-primary input:checked+label::before { background-color: #4183d7; border-color: #4183d7 } .checkbox3.checkbox-success input:checked+label::before { background-color: #36b846; border-color: #36b846 } .checkbox3.checkbox-warning input:checked+label::before { background-color: #ff9c00; border-color: #ff9c00 } .checkbox3.checkbox-danger input:checked+label::before { background-color: #e50011; border-color: #e50011 } .checkbox3.checkbox-primary.checkbox-light input:checked+label::before { background-color: transparent; border-color: #4183d7 } .checkbox3.checkbox-primary.checkbox-light input:checked+label::after { color: #4183d7 } .checkbox3.checkbox-info.checkbox-light input:checked+label::before { background-color: transparent; border-color: #2caef5 } .checkbox3.checkbox-info.checkbox-light input:checked+label::after { color: #2caef5 } .checkbox3.checkbox-success.checkbox-light input:checked+label::before { background-color: transparent; border-color: #36b846 } .checkbox3.checkbox-success.checkbox-light input:checked+label::after { color: #36b846 } .checkbox3.checkbox-warning.checkbox-light input:checked+label::before { background-color: transparent; border-color: #ff9c00 } .checkbox3.checkbox-warning.checkbox-light input:checked+label::after { color: #ff9c00 } .checkbox3.checkbox-danger.checkbox-light input:checked+label::before { background-color: transparent; border-color: #e50011 } .checkbox3.checkbox-danger.checkbox-light input:checked+label::after { color: #e50011 } .radio3 { position: relative } .radio3 input { position: absolute; left: -9999px } .radio3 label { display: block; position: relative; padding: 11px 0 11px 25px; font-size: 12px; margin-bottom: 0; margin-top: -4px } .radio3 label::after, .radio3 label::before { content: ''; display: block; position: absolute; top: 10px; bottom: 10px; left: 0 } .radio3 label::before { width: 23px; height: 23px; border: 1px solid #CCC; -webkit-transition: background-color .2s; -moz-transition: background-color .2s; transition: background-color .2s } .radio3 label::after { width: 23px; height: 23px; border: 12px solid #FFF; margin: 1px; -webkit-transition: all 50ms; -moz-transition: all 50ms; transition: all 50ms; opacity: 0 } .radio3 input:checked+label::before { font-family: FontAwesome; border-width: 1px; border-style: solid; background-color: #1380d7; border-color: #1380d7; color: #fff } .radio3 input:checked+label::after { border: 3px solid #FFF; opacity: 1 } .radio3.radio-check label::after, .radio3.radio-check.radio-light label::after { content: "\f00c"; font-family: FontAwesome; color: #FFF; width: 20px; height: 23px; line-height: 20px; vertical-align: middle; text-align: center; border-width: 0 } .radio3 label::after, .radio3 label::before { -moz-border-radius: 20px; border-radius: 20px } .radio3.radio-check input:checked+label::after { border-width: 0 } .radio3.radio-check.radio-light input:checked+label::before { background-color: transparent } .radio3.radio-check.radio-light input:checked+label::after { border-width: 0; color: #444 } .radio3.radio-sm label { padding: 8px 0 8px 22px } .radio3.radio-sm label::before { width: 14px; height: 14px; line-height: 14px } .radio3.radio-sm label::after { width: 12px; height: 12px } .radio3.radio-lg label { padding: 15px 0 15px 40px } .radio3.radio-lg label::before { width: 28px; height: 27px; line-height: 24px } .radio3.radio-lg label::after { width: 26px; height: 25px } .radio3.radio-check.radio-sm label::after { font-size: 9px; line-height: 12px; width: 12px } .radio3.radio-check.radio-lg label::after { font-size: 16px; line-height: 26px; width: 26px } .radio3.radio-primary input:checked+label::before { background-color: #4183d7; border-color: #4183d7 } .radio3.radio-info input:checked+label::before { background-color: #2caef5; border-color: #2caef5 } .radio3.radio-success input:checked+label::before { background-color: #36b846; border-color: #36b846 } .radio3.radio-warning input:checked+label::before { background-color: #ff9c00; border-color: #ff9c00 } .radio3.radio-danger input:checked+label::before { background-color: #e50011; border-color: #e50011 } .radio3.radio-primary.radio-light input:checked+label::before { background-color: transparent } .radio3.radio-primary.radio-light input:checked+label::after { color: #4183d7 } .radio3.radio-info.radio-light input:checked+label::before { background-color: transparent } .radio3.radio-info.radio-light input:checked+label::after { color: #2caef5 } .radio3.radio-success.radio-light input:checked+label::before { background-color: transparent } .radio3.radio-success.radio-light input:checked+label::after { color: #36b846 } .radio3.radio-warning.radio-light input:checked+label::before { background-color: transparent } .radio3.radio-warning.radio-light input:checked+label::after { color: #ff9c00 } .radio3.radio-danger.radio-light input:checked+label::before { background-color: transparent } .radio3.radio-danger.radio-light input:checked+label::after { color: #e50011 }