/* o nome 'e este mas o tamanho padrao é menor */
.tamanho-236 {
  width: 220px;
}

/* memso axemplo */
.tamanho-124 {
  width: 100px;
}
/* texto cinza claro */
.texto-cinza-light {
  color: #4A5461;
}
/* botao bolao da pagina time */
.botao-bolao-times {
  width: 72px;
  height: 72px;
  background-color: #00332F;
}

/* tamanho do botao com o icone estatistico */
.botao-bolao-times-3 {
  width: 36px;
  height: 56px;
}
/* aba ativa da tab de classificacao */
.abas .nav-link.active {
  background-color: #E9ECEF;
  border-bottom: solid green;
}
/* aba ativo do grupo */
.abas-grupos .nav-link.active {
  background-color: #00332F;

  color: #98F900;
}
/* cor do botao ativo */
.abas-grupos .nav-link {
  background-color: #E9ECEF;
  color: #CED4DA;
  border: 1px solid #CED4DA;
  border-radius: 5px;
}

.t-142 {
  width: 142px;
}

/* bordas abaixo sao das classificoes primeiro lugar, ultimo lugar e perto do ultimo */
.borda-esquerda-verde {
  border-left: #98F900 solid 2px;

}

.borda-esquerda-vermelha {
  border-left: red solid 2px;

}

.borda-esquerda-amarela {
  border-left: yellow solid 2px;

}
/* cor das bolinhas das oitavas */
.verde-sucesso {
  color: #22BF47;
}

.vermelho-cor {
  color: red
}

@media (max-width: 640px), (min-width: 375px) {
  /* no mobile o tamanho 236 'e menor, tamanho da parte dos times */
  .tamanho-236 {
    width: 220px;
  }
/* para o swiper e seu overflow nao sairem da tela */
  .swiper-container {
    overflow: hidden;
  }
/*  */
  .tamanho-124 {
    width: 100px;
  }

  .texto-cinza-light {
    color: #4A5461;
  }

  .botao-bolao-times {
    width: 72px;
    height: 72px;
    background-color: #00332F;
  }


  .botao-bolao-times-3 {
    width: 36px;
    height: 56px;

  }
}