/* Divs */
div#race {
    width: 100%;
    margin: 20px 0;
    overflow:hidden;
    box-sizing:border-box;
}

div#racenumber {
    display:inline-block;
    vertical-align:top;
    width: 15%;
    text-align: left;
    font-size: 1.2em;
    font-weight: bold;
}

div#racedetails {
    display:inline-block;
    width: 70%;
}

div#racename {
    text-align: center;
    font-size: 1.2em;
    font-weight: bold;
}

div#racedistance {
    display:inline-block;
    vertical-align:top;
    width: 15%;
    text-align: right;
    font-size: 1.2em;
    font-weight: bold;
}

div#prizemoney {
    text-align: center;
}

div#conditions {
    text-align: center;
}

div#racerecord {
    text-align: center;
}

div.bonus {
    text-align: center;
}



div.raceentry {
    width: 100%;
    margin: 20px 0;
    border-top: 2px solid #000000;
}

div.tabnumber {
    width: 10%;
    height:60px;
    float:left;
    vertical-align:top;
    font-size: 3em;
    line-height:1.2em;
    font-weight: bold;
}

div.horsedetails {
    width: 90%;
    display:inline-block;
    vertical-align:top;
}

div.horsename {
    display:inline-block;
    width:50%;
    font-size: 1.2em;
    font-weight: bold;
    text-transform: uppercase;
}

div.jockey {
    display:inline-block;
    width:50%;
    text-align:right;
    font-size: 1.1em;
    font-weight: bold;
}

span.weight {
    font-size: 1.2em;
    font-weight: bold;
    margin-left: 1em;
}

div.breeding {
    width: 90%;
    display:inline-block;
}

div.owners {
    width: 90%;
    display:inline-block;
}

div.colours {
    width: 50%;
    display:inline-block;
    font-weight: bold;
    text-transform: uppercase;
}

div.trainer {
    width: 50%;
    display:inline-block;
    text-align: right;
    font-weight: bold;
}

div.firststart {
    font-weight: bold;
}

div.resultsummary {
    display:inline-block;
    margin-right: 0.5em;
}

span.resultsummarylabel {
    font-weight: bold;
}

div.laststart {
    width: 100%;
    margin-top: 10px;
    font-size:0.8em;
}

div.laststartwhen {
    vertical-align:top;
    width: 10%;
    display:inline-block;
}

div.laststartdetail {
    vertical-align:top;
    width: 90%;
    display:inline-block;
}

span.horsename {
    font-weight: bold;
    text-transform: uppercase;
}

span.emergency {
    font-size: 0.6em;
}

span.blinkers {
    font-size: 0.6em;
}


@media only screen and (max-width: 650px)  {
	
	table.raceresults td:nth-of-type(1):before { content: "Finished"; }
	table.raceresults td:nth-of-type(2):before { content: "Horse"; }
	table.raceresults td:nth-of-type(3):before { content: "Jockey"; }
	table.raceresults td:nth-of-type(4):before { content: "Trainer"; }
	table.raceresults td:nth-of-type(5):before { content: "Weight"; }
	table.raceresults td:nth-of-type(6):before { content: "Margin"; }
	table.raceresults td:nth-of-type(7):before { content: "Price"; }
	
	table.raceentries td:nth-of-type(1):before { content: "Number"; }
	table.raceentries td:nth-of-type(2):before { content: "Horse"; }
	table.raceentries td:nth-of-type(3):before { content: "Jockey"; }
	table.raceentries td:nth-of-type(4):before { content: "Trainer"; }
	table.raceentries td:nth-of-type(5):before { content: "Weight"; }
	table.raceentries td:nth-of-type(6):before { content: "Margin"; }
	table.raceentries td:nth-of-type(7):before { content: "Price"; }

}