give css to checkbox

I am new to CSS.

I want to give CSS to checkbox just shown in the image.here is the image

i have tried but checkbox is appearing on the screen and when I select on of the category then it background would be yellow.

Thank You.

.radio_toggle {
  float:left;
}

.radio_toggle label {
  float:left;
  width:100px;
  overflow:auto;

}

.radio_toggle label span {
  text-align:center;
  font-size: 15px;
  padding:5px 0px;
  display:block;

}

.radio_toggle label input {
  position:absolute;
}

.radio_toggle .venue {
  background-color:#edf1f2;
  color: #58666e;
  min-height: 100% !important;
  border: thin #ced9db solid;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;

}

<div class="categories">
                                        <div class="radio_toggle">
                                            <label class="venue" style=""><input type="checkbox" name="toggle"><span>Category</span></label>
                                        </div>
                                    </div>

                                    <div class="categories">
                                        <div class="radio_toggle">
                                            <label class="venue" style=""><input type="checkbox" name="toggle"><span>Category</span></label>
                                        </div>
                                    </div>

                                    <div class="categories">
                                        <div class="radio_toggle">
                                            <label class="venue" style=""><input type="checkbox" name="toggle"><span>Category</span></label>
                                        </div>
                                    </div>