ul.jogos_bolao{
width: 100%;
min-width: 300px;  
margin: auto;
display: table;
border: 1px solid #ccc;
margin-top: 50px;
margin-bottom: 10px;

}	
ul.jogos_bolao li{
width: 100%;
margin-bottom:2px;
}

ul.jogos_bolao li .box_content{
width: 100%;
padding: 10px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #ccc;

position: relative;
}
ul.jogos_bolao li:last-child .box_content{border-bottom: none;}

ul.jogos_bolao li .box_content article{
width: 40%;
height: 43px;
padding: 0 5px;
margin: 0 auto;
overflow: hidden;
text-align: center;

display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
ul.jogos_bolao li .box_content article:nth-of-type(2){
width: 19%;
height: 40px;
margin: 0 0.5%;
flex-direction: column;
}

ul.jogos_bolao li .box_content article:nth-of-type(1) div{
text-align: left;
}
ul.jogos_bolao li .box_content article:nth-of-type(3) div{
text-align: right;
}
ul.jogos_bolao li .box_content article div img{
width: 30px;
height:30px;
margin: 0 auto;
margin-bottom: 0px;
}
ul.jogos_bolao li .box_content article div h5{
font-size: 0.7em;
color: #555;	
margin-top: -7px;
}

ul.jogos_bolao li .box_content article input{
width: 50px;
height: 25px;
text-align: center;
border: 1px solid #ccc;
border-radius: 4px;
}

ul.jogos_bolao li .box_content article:nth-of-type(2){
display: flex;
justify-content: center;
align-items: center;
}

ul.jogos_bolao li .box_content article:nth-of-type(2) b{
background:#663399;
width: fit-content;
height: auto;
font-size:0.5em;
color:#fff;
padding:2px;
border-radius:4px;
position: absolute;
bottom: 0;
left: 49%;
margin-left: -20px;
}

ul.jogos_bolao li .box_content article:nth-of-type(2) h5{
font-size: 0.8em;
}


ul.jogos_bolao li .box_content article input.custom_check{ 
-webkit-appearance: none;
appearance: none;  
background-color: #fff;
margin: 0;

font: inherit;
color: currentColor;
border: 0.15em solid currentColor;
border-radius: 0.15em;
transform: translateY(-0.075em);

width:50px;
height:23px;
display: grid;
place-content: center;
position: relative;
}

input.custom_check::before {
  content: "";
  width: 1em;
  height: 1em;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--form-control-color);
  background-color: CanvasText;

/*Comentar linhas abaixo se quiser preencher com um quadrado*/
  transform-origin: bottom left;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

input.custom_check:checked::before {
  transform: scale(1);
}


ul.jogos_bolao li .box_content article:nth-of-type(1) input::after{
content: 'Casa';
position: absolute;
top: -13px;
left: 10px;
font-size: 9px;
}

ul.jogos_bolao li .box_content article:nth-of-type(2) input::after{
content: 'Empate';
position: absolute;
top: -13px;
left: 4px;
font-size: 9px;
}

ul.jogos_bolao li .box_content article:nth-of-type(3) input::after{
content: 'Fora';
position: absolute;
top: -13px;
left: 10px;
font-size: 9px;
}


ul.extras{
width: 100%;;
height: auto;
display: table;

}
ul.extras li{
width: 100%;

display: flex;
justify-content: space-between;
margin-bottom: 5px;
padding: 0 10px;
border-bottom: 1px solid #ddd;
box-shadow: 0 2px 2px #333;
}


@media(max-width:400px){
ul.jogos_bolao li .box_content article div h5{font-size: 0.5em;}
}

@media(max-width:322px){
ul.jogos_bolao li .box_content article div h5{font-size: 0.4em;margin-top: -5px;}
}