/** * Custom Style for Radio Image Control * * @package Canary Led */ .customize-control-bd-radio-image input { display: none; } .customize-control-bd-radio-image input:checked + label img { border: 2px solid #2d932f; } .customize-control-repeater .repeater-fields .repeater-row .repeater-field.repeater-field-radio-image input:checked + label img { border: 2px solid #2d932f; } label.select-layoutright { margin-right: 10px; } .customize-control-radio input[type="radio"] { opacity: 0; position: fixed; width: 0; } .customize-control-radio label { display: inline-block; background-color: #7dc487; padding: 2px 5px; font-family: sans-serif, Arial; font-size: 14px; border: 1px solid #2d932f; border-radius: 4px; } .customize-control-radio input[type="radio"]:checked + label { background-color:#2d932f; border-color: #2d932f; color: #fff; } .customize-control-radio input[type="radio"]:focus + label { border: 2px dashed #444; } .customize-control-radio label:hover { background-color: #a6e1ff; } .customize-control.customize-control-radio .customize-inside-control-row { margin: 10px 10px 0 0; float: left; } .customize-control.customize-control-checkbox .customize-inside-control-row { width: 100%; margin: 0; } input[type=checkbox] { background-color: #fafafa; border: 1px solid #ddd; border-radius: 20px; box-shadow: none; float: right; transition: all .4s ease; width: 50px; height: 26px; } input[type=checkbox]:checked { background-color: #2d932f; } input[type=checkbox]:after { content: ""; background-color: #fff; height: 18px; width: 18px; position: relative; display: block; border-radius: 20px; top: 3px; left: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 0 rgba(0, 0, 0, 0.08); } input[type=checkbox]:focus { box-shadow: none; border: 1px solid #e8eae9; } input[type=checkbox]:checked:after { display: none; } input[type=checkbox]:before { background-color: #fff; border: 1px solid #fff; height: 18px !important; width: 18px !important; float: right !important; position: relative; border-radius: 20px; color: #fff; top: 5px; right: 2px; } input[type=checkbox]:checked:before { content: "" !important; }