.li-hover:hover{
background-color: black;
}

.border-bawah{
border-bottom: 1px solid black;
}

body
{
	font-family:"Trebuchet MS";
}


/* The container */
.container_radio {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container_radio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
  border: 1px solid #bababa;
}

/* On mouse-over, add a grey background color */
.container_radio:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container_radio input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container_radio input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container_radio .checkmark:after {
	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}


/*************************** Radio Button With Images ***************************/
.input-hidden {
  position: absolute;
  left: -9999px;
}

input[type=radio]:checked + label {
  border: 1px solid #bababa;
  box-shadow: 0 0 3px 3px #0065b6;
  
}

input[type=radio]:hover + label {
  border: 1px solid #bababa;
  box-shadow: 0 0 3px 3px #ccc;
  cursor: pointer;
}

input[type=radio]:checked:hover + label {
  border: 1px solid #bababa;
  box-shadow: 0 0 3px 3px #0065b6;
}

/* Stuff after this is only to make things more pretty */
input[type=radio] + label {
  border: 1px solid #bababa;
  transition: 200ms all;
}




/*************************** checkbox Button With Images ***************************/
.input-hidden-checkbox {
  position: absolute;
  left: -9999px;
}

input[type=checkbox]:checked + label {
  border: 1px solid #bababa;
  box-shadow: 0 0 3px 3px #0065b6;
  
}

input[type=checkbox]:hover + label {
  border: 1px solid #bababa;
  box-shadow: 0 0 3px 3px #ccc;
  cursor: pointer;
}

input[type=checkbox]:checked:hover + label {
  border: 1px solid #bababa;
  box-shadow: 0 0 3px 3px #0065b6;
}

/* Stuff after this is only to make things more pretty */
input[type=checkbox] + label {
  border: 1px solid #bababa;
  transition: 200ms all;
}