@charset "utf-8";
/* CSS Document */
body{font-family: 'Open Sans', sans-serif;}
a{cursor:pointer}
.inline-block{display:inline-block}

.racewrapper{background:#D3FFFE; background-size:cover; background-position:center; background-repeat:repeat-x}
.pagetitle{background:#0885C2; font-size:1.5em; padding:.5em; color:#FFF;}
.racenav{background:#0885C2; z-index:5; padding:0em 0em .5em 0em; border-bottom:3px solid #034C70}
	.racenav>div{white-space:nowrap}
	.racenav a{color:#FFF;}
.raceinfo{color:#000;}
h1.racetitle{margin-bottom:0px; font-size:30px; margin-top:.25em; font-weight:bold}
.racedescription{margin-bottom:.25em}
	.standingwrecwrapper{	
		text-shadow:none;
		display:inline-block;	
		background: #ffce00;
		border-radius: 5px;
		color: #000;
		padding: .1em .5em;
		position: relative;}
	.standingorecwrapper{	
		text-shadow:none;	
		display:inline-block;		
		background: #1200FF;
		border-radius: 5px;
		color:#FFF;
		padding: .1em .5em;
		position: relative;}

.fieldwrapper{height:285px; perspective:285px; -webkit-perspective:285px; margin-bottom:1.5em; z-index:1; margin-top:-43px; pointer-events:none;}

.starterwrapper{background:#3b5e00;border-bottom:.5em solid #B93F00; margin-top:5px;}
.starter{z-index:2; margin:.35em .25em .35em .25em; padding:.25em 1em; border-radius:3px; border:0px; border-bottom: 3px solid #aaa;font-weight:bold; box-shadow:0px 0px 10px #000; font-size:2em}
	.starter:hover{}
	.starter img{transition: transform .5s; height:1.25em; position:relative;}
	.starter:hover img{transform:rotate(-40deg) translate(5px,-2px)}
	
.field{z-index:1;position:absolute; top:0px; left:0px; background:#B93F00;transform:rotateX(30deg); height:100%; width:80%; margin-left:10%; border-top:5px solid #FFF; border-left:5px solid #FFF; border-right:5px solid #FFF;}
.lanewrapper{position:fixed; top:0px; left:0px; background:#B93F00;  transform:rotateX(30deg); height:100%; width:400%; margin-left:-200%; border-top:5px solid #FFF; z-index:-1}
.lane{
	height:35px; 
	border-bottom:2px solid #FFF;
	font-weight:bold;
	color:#FFF;
	line-height:35px;
	text-align:left;
	perspective:35px;
	white-space:nowrap;
	text-wrap:none;
	z-index:200
}
.lane span{margin-left:.25em; height:27px;text-shadow:0px 1px 5px #000}
.lane .indicator{width:5px; height:100%; background:#00FFF3;position:absolute; top:0px; margin-left:0px;left:-5px; display:none; z-index:100;}
.lane .name{font-size:1.25em}
	.lane .firstname{margin-left:.25em}
	.lane .lastname{text-transform:uppercase}
.lane .country{position:relative; top:4px; left:2px; display:inline-block; padding:0px; height:25px; width:50px;}
.lane .country img{max-width:100%; max-height:100%; position:absolute; top:0px; left:0px; box-shadow:0px 0px 5px #000;}
.lane .country:after{position:absolute; top:2px; right:0px;text-shadow:0px 1px 5px #000, 0px -1px 5px #000;text-transform:uppercase;}
	.country.aho:after{content:'aho'}
	.country.aus:after{content:'aus'}
	.country.bah:after{content:'bah'}
	.country.bar:after{content:'bar'}
	.country.blr:after{content:'blr'}
	.country.bra:after{content:'bra'}
	.country.bul:after{content:'bul'}
	.country.can:after{content:'can'}
	.country.civ:after{content:'civ'}
	.country.cub:after{content:'cub'}
	.country.eun:after{content:'eun'}
	.country.fra:after{content:'fra'}
	.country.frg:after{content:'frg'}
	.country.gbr:after{content:'gbr'}
	.country.gdr:after{content:'gdr'}
	.country.ger:after{content:'ger'}
	.country.gha:after{content:'gha'}
	.country.gre:after{content:'gre'}
	.country.hun:after{content:'hun'}
	.country.ita:after{content:'ita'}
	.country.jam:after{content:'jam'}
	.country.jpn:after{content:'jpn'}
	.country.mad:after{content:'mad'}
	.country.nam:after{content:'nam'}
	.country.ned:after{content:'ned'}
	.country.ngr:after{content:'ngr'}
	.country.nzl:after{content:'nzl'}
	.country.pan:after{content:'pan'}
	.country.pol:after{content:'pol'}
	.country.por:after{content:'por'}
	.country.roc:after{content:'roc'}
	.country.rsa:after{content:'rsa'}
	.country.rus:after{content:'rus'}
	.country.skn:after{content:'skn'}
	.country.swe:after{content:'swe'}
	.country.tch:after{content:'tch'}
	.country.tto:after{content:'tto'}
	.country.ukr:after{content:'ukr'}
	.country.urs:after{content:'urs'}
	.country.usa:after{content:'usa'}
.lane .result{position:absolute; right:0px; opacity:0;}
	.lane .record.WR,.lane .record.EWR{
		text-shadow:none;
		background: #ffce00;
		border-radius: 5px;
		color: #000;
		padding: .1em .5em;
		height: 200%;
		position: relative;
		top: -1px;
	}
	.lane .record.WR:after{content:"WR"}
	.lane .record.EWR:after{content:"=WR"}	
	.lane .record.OR,.lane .record.EOR{
		text-shadow:none;		
		background: #1200FF;
		border-radius: 5px;
		color: #FFF;
		padding: .1em .5em;
		height: 200%;
		position: relative;
		top: -2px;
	}	
	.lane .record.OR:after{content:"OR"}
	.lane .record.EOR:after{content:"=OR"}		
	.lane .place{font-size:1.25em; margin-right:.5em;
		border-radius:100%;
		margin-top:4px;
		width:30px;
		height:25px;
		display:inline-block;
		text-align:center;
		line-height:21px;
	}
	.lane .place.p1{text-shadow:none;border:2px solid #fff; background-color:#FFD600; color:#000;}
	.lane .place.p2{text-shadow:none;border:2px solid #fff; background-color:#E4EBEB; color:#000;}
	.lane .place.p3{text-shadow:none;border:2px solid #fff; background-color:#CD7F32; color:#000;}	
	.lane .time{position:relative; top:2px;}	
	
.recordlane{z-index:1}
	.recordlane .indicator{width:2px; height:100%; position:absolute; top:0px; margin-left:3px;left:-5px; display:none;}
	.recordlane.wrec .indicator{background:#FFCE00 !important;z-index:-1}
	.recordlane.orec .indicator{background:#1200FF !important;z-index:-1}
	
.fieldbottomborder{border-top:1em solid #B93F00; margin-top:5px;}
	
.gameslist td{vertical-align:middle !important;}
.gameslist td:first-of-type{text-align:right;width:50%}
	.gameslist .hostcity, .gameslist .hostcountry{display:inline; white-space:nowrap; hanging-punctuation:last; }
		.gameslist .hostcity:after{content:","}			
	.gameslist .year{font-size:1.25em;}
.gameslist td:last-of-type{text-align:left;width:50%}
.gameslist a{display:block}
	@media (max-width:600px){
		.lane .name{font-size:1em}
	}
	@media (max-width: 525px) {	
		.lane .record{top:-10px !important; padding:0px 5px !important; font-size:.75em}
		.lane .country{width:30px;}
		.lane .country:after{top:4px; font-size:.75em;}
		.lane .name{font-size:1em;}
			.lane .firstname{display:none}
			.lane .lastname{margin-left:0px;position:relative; top:4px;}
		.lane .place{margin-right:.25em; margin-left:0px;}
		.lane .time{top:-9px}
		
	}