/*
*	get common styles - filter bg, sport filter, day of week display...
*/
@import "leaguedisplay.css";

/* --- day filter --- */
	div#dayFilterBox{
		float:left;
		width:190px;
		text-align:left;
	}
	div#dayFilterBox ul{
		margin-top:8px;
	}
	div#dayFilterBox li{
		background: url(../graphics/day-button-bg.gif);
		border:0;
		padding-top: 6px;
		height: 17px;
		width: 25px;
	}
	div#dayFilterBox li#filter_AllDays{
		margin-left: 50px;
		margin-top: 5px;
		width: 66px;
		height: 16px;
		background: url(../graphics/alldays-button-bg.gif);
	}

/* --- location filter --- */
	div#locationFilterBox{
		float:left;
		margin-left: 12px;
		width: 200px;
	}
	div#locationFilterBox select{
		width: 200px;
	}
	div#locationFilterSwitcher{
		font-size:10px;
		margin:0 0 10px 20px;
		line-height:20px;
		vertical-align:middle;
	}
	div#locationFilterSwitcher input{
		vertical-align:middle;
	}
	div#locationFilterSwitcher span{
		vertical-align:middle;
		padding-left: 5px;
	}


/* ----- message for empty results ---- */
	
	div#emptyResultHint li{
		margin: 10px 0;
	}


/* ---------------------------------------
		leagues
------------------------------------------*/

/*-----container for each league-------*/
	div.leagueDetail{
		margin: 20px 0 40px 0;
		width: 750px;
		position:relative;
	}
	
/*----- 'Inner' container for each league, containing everything but the league name-------*/
	div.detailContainer{	border:1px solid #ccc; }

/*-----Leauge Name-------*/
	.leagueDetail h3{ 
		color: #333;
		padding: 0 12px 0 0;
		font-size:16px;
		margin:0 0 1px 0;
		border-bottom:1px solid #f4f4f4;
	}
	div.leagueDetail h3 img{
	vertical-align:middle;
	margin:0;
	padding: 0 3px;
	background:#fff;
	}
/*---- text styles for labels ---*/
	div.label{	margin-bottom:4px;	}
	span.label{	padding-right: 6px;	}
	
	
/*---- start date box ----*/
	div.startDate{
		position:relative;
		text-align:left;
	}
	div.startDate div.date{
		background:#f4f4f4;
		color:#333;
		padding: 6px;
		width: 250px;
		font-weight:bold;
		font-size: 12px;
		text-align:center;
		border:1px solid #e4e4e4;
		border-left:none;
		border-top:none;
	}
	/* team and indy quick sign-up links */
	div.signupLinks{
		position:absolute;
		top: 5px;
		left: 290px;
	}
	div.signupLinks, div.signupLinks a{
		font-size:12px;
		font-weight:bold;
		color:#393;
	}
	

/*---- overview container has the sport, days, game start times, location, and skill level overviewss--- */
	div.overviewContainer{
		position:relative;
		height:70px;
		overflow:visible;
	}
	/* -- each overview piece behaves in the same way -- */
	div.leagueDetail div.dayChart,
	div.leagueDetail div.startTimes,
	div.leagueDetail div.locations,
	div.leagueDetail div.skillLevels,
	div.leagueDetail img.sportIcon{
		position:absolute;
		top:15px;
		text-align:center;
	}
	div.dayChart {
		
	}
	
	
/* --- sport icon --- */
div.leagueDetail img.sportIcon{
	top:5px;
	left: 25px;
}
	
/*--- start times ----*/
	div.leagueDetail div.startTimes{
		left: 270px;
		width: 140px;
		font-weight:bold;
	}
	
/* --- locations --- */	
	div.leagueDetail div.locations{
		z-index:1;
		left:420px;
		width: 180px;
	}
	div.leagueDetail div.locations li a{
		font-size:11px;
	}

	a.extraLocationLink{
		display:block;
		text-align:center;
		font-size: 10px;
	}
	
	#extraLocationPopup h4{
		margin-bottom: 10px;
	}

	div.leagueDetail div.skillLevels{
		left: 610px;
		width:130px;
	}
/* --- league description text --- */
	div.leagueDetail div.leagueDescription{
		width: 360px;
		margin: 0 0 0 20px;
		text-align:justify;
		padding-bottom:10px;
	}

/*  ------------------------------------
----- detail open and close buttons ----
----------------------------------------*/
	div.showLeagueDetails,div.hideLeagueDetails{
		height:22px;
		overflow:hidden;
		background:url(../graphics/details-bar-button.gif) no-repeat top left;
	}
	
	div.hideLeagueDetails{
		background-position:bottom left;
	}
	
	
/*  ------------------------------------
----- moving into the details section -------
----------------------------------------*/

div.detailedInfo{
	position:relative;
}
div.detailedInfo div.dates,
div.detailedInfo div.times,
div.detailedInfo div.signupDeadline
{
	margin: 10px 0 0 20px;
	font-weight:bold;
}
div.detailedInfo div.times{
	width:640px;
}
div.detailedInfo h4{
	text-align:left;
	margin: 20px;
	border-top:1px solid #ddd;
	padding-top: 20px;
}

/* ---- division detail and sign-up tables ----- */
table.divisionDetails{
	margin-bottom: 10px;
	width: 720px;
	border-collapse:separate;
}
table.divisionDetails th{
	text-align:center;
	color:#777;
	font-weight:normal;
	padding: 4px;
}
table.divisionDetails td{
	padding:6px;
	text-align:center;
	font-weight:bold;
}
tr.toprow td{
	border-top:1px solid #000;
	background:#fbfbfb;
	border-bottom:1px solid #eee;
}
tr.bottomrow td{
	border-bottom:1px solid #000;
}
tr.onlyrow td{
	border-bottom:1px solid #000;
	border-top:1px solid #000;
}
table.divisionDetails tr td.divisionName{
	width: 100px;
	border-top:0;
	border-bottom:0;
	border-right:1px solid #000;
	text-align:right;
	background:#fff;
	font-size:14px;
}
table.divisionDetails td.skillCell{
	border-bottom:1px solid #000;
	background:#fff;
	width:120px;
}
table.divisionDetails td.playerCell{
	border-right:2px solid #eee;
	border-left:1px solid #eee;
	border-bottom:1px solid #000;
	background:#fff;
	width: 80px;
}

table.divisionDetails td.signUpType{	color:#777;	}

table.divisionDetails td.signUpCell{
	border-right:1px solid #000;
}

div.Open,div.Closed,div.Waitlist{
	text-transform: uppercase;
}
table.divisionDetails td div.openDate{
	color:#16a;
}

table.divisionDetails td.signUpCell{	
	color:#393;
	vertical-align:top;
}