main {
  font-family:sans-serif;
  font-size:11px;
  padding:10px;
  line-height:1.4em;
}

main, ul.generator {
  display:-webkit-flex;
  display:flex;
}

ul.generator {
  -webkit-flex-direction:column;
  flex-direction:column;
  width: 600px;
  list-style:none;
  padding:0;
}


.game + li {
  -webkit-flex-grow:1;
  flex-grow:1;
  height:215px;

  
}

li:first-child,li:last-child {
  -webkit-flex-grow:.5;
  flex-grow:.5;
}

.game {
  padding-left:1px;
}

.game-top, .game-lone,  .game-bottom {
  border-bottom:1px solid #000000;
}
.game-lone{width:90%; margin-left:12px;}


.game-bottom, .game-top + li {
  border-right:1px solid #000000; 
}

.game-top + li {
  display: flex;
  align-items: center;
  justify-content: center;
}


.game-top + li, .finaltext {
  color: #555;
  font-weight: normal;
}


.right .game {
  text-align: right;
  padding-right: 6px;
  padding-left: 0;
}

.right .game-bottom, .right .game-top + li {
  border-left:1px solid #000000; 
  border-right: 0;
}


input[type=text] {
width:92%;
border:none;
font-size:18px;
}

input[name='time[]'] {
font-size:10px;
border: #EAEAEA solid 1px;
padding-top:2px;
text-align:center;
}
 input[name='champion']{
text-align:center;

}
.finaltext {
  width: 18%;
  text-align: center;
  margin: 20px 0 0 140px;
  position: absolute;
}
.champions {
  margin-left:125px;
  width: 20%;
  text-align: center;
  margin-top: 100px;
  position: absolute;
  border-bottom:solid #000000 1px;
 
}
.winner {
font-size:15px;
 width: 100%;
  text-align: center;
  padding-top: 4px;
  position: absolute; 
}
.right-align{
text-align:right;}

.center-align{
text-align:center;}
.bracket-title{
font-size:30px;
font-weight:bold;
padding-top:15px;
}
.gen-border{
border-top:#efefef thin solid;
border-bottom:#efefef thin solid;
}

span{
font-size:13px;;
padding-right:6px;
}

.right-pad{
padding-left:6px;
padding-right:0px;

}

@media only screen and (max-width:767px){body{width:auto;}
.winner{
  font-size:8px;

}
.champions {
  margin-left:5px;
  width: 13%;
}
.finaltext {
  width: 15%;
  text-align: center;
 margin: 2px 0 0 3px;
  position: absolute;
}
}
