body {

  font-family: 'Roboto Condensed', sans-serif;
    color: #9fb0b7;
}



.score {
    width: auto;
    height: 20px;
    padding: 2px 8px;
    background-color: #e9f1f5;
    display: inline-block;
    vertical-align: center;
}

.VScirculo {
    border-radius: 50%;

    width: 20px;
    height: 20px;
    padding: 3px;
    color: #ffffff;
    display: inline-block;
    vertical-align: center;
    background-color: #adcc78;
}


.circulo {
    border-radius: 50%;
    border: 2px solid;

    width: 18px;
    height: 18px;
    
    display: inline-block;
    vertical-align: text-bottom;
    margin-left: 15px;
    margin-right: 5px;
    margin-top: 10px;

}

#svgDiv {
	
	/*margin: 0 auto;
  width: 900px;*/
  width: 700px;
}


#scoreboard {

  z-index: 10;
  margin-top: 264px;
  margin-left: 157px;
  width: 20px;
  position: absolute;
}

ul {

  vertical-align: middle;
}

li {
  vertical-align: middle;
  width: 385px;
  text-align: center;
}

.liSpace {

  padding-top: 30px;
}

#fifa {
  font-weight: 300;
  text-transform: uppercase;
  font-size: 34px;
  color: #fcb03c;
}


#Phase {
  font-weight: 300;
  text-transform: uppercase;
  font-size: 20px;

}

#Winner, #Loser {
  
  font-weight: 300;
  font-size: 25px;
  vertical-align: top;

}
/********  SVG *************/


svg {

  z-index: -1;
  float: left;
  width: 900px;
  margin: 0 auto;

}

.solid1{
  fill: #148aa5;
  stroke: none;
}


.line1 {
    fill: #ffffff;
    stroke: #148aa5;
}

.group:hover .solid1, .solid1:hover { fill: #007698;}
.group:hover .line1, .line1:hover { fill: #eefcff; stroke:#007698;}


.solid2{
  fill: #a1cd73;
  stroke:none;
}

.line2{
  fill:#ffffff;
  stroke:#a1cd73;
}

.group:hover .solid2, .solid2:hover { fill: #7fc636;}
.group:hover .line2, .line2:hover { fill: #f3fde6; stroke:#7fc636;}


.solid3{
  fill: #fcb03c;
  stroke:none;
}

.line3{
  fill:#ffffff;
  stroke:#fcb03c;
}

.group:hover .solid3, .solid3:hover { fill: #fca41a;}
.group:hover .line3, .line3:hover { fill: #fff9df; stroke:#fca41a;}


.solid4{
  fill: #e8754d;
  stroke:none;
}

.line4{
  fill:#ffffff;
  stroke:#e8754d;
}

.group:hover .solid4, .solid4:hover { fill: #e64f1b;}
.group:hover .line4, .line4:hover { fill: #ffefe1; stroke:#e64f1b;}



