h1 {color:#FFE47A; font-size:1.5em; text-shadow: 1px 2px 0 black;}
a:link {text-decoration:none; color:#505050;}
a:visited {text-decoration:none; color:#505050;}
a:hover,a:active {text-decoration:underline; color:#FFE47A;}
	
div#divContainer {
    max-width: 60em;
	width:52em;
    margin: 0 auto;
    font-family: Calibri;
    padding: 0.5em 1em 1em 1em;
	table-layout: fixed;
	overflow-x: auto; 
	/* rounded corners */
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /* gradient */
    background-image: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#808080));
    background-image: -moz-linear-gradient(top, #606060, #808080);
	background-image: -ms-linear-gradient(top, #606060, #808080);
	background-image: linear-gradient(to bottom, #606060, #808080);
    /* box shadows */
    -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
    -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
    box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
    }

a.sea {text-decoration:none;color:inherit;}
a.sea:hover {text-decoration:inherit;color:inherit;}
a.sea:active {text-decoration:underline;color:blue;}
a.sea:focus {text-decoration:underline;color:blue;}

a.plink {text-decoration:none; color:#FFE47A;}
a.plink:hover {text-decoration:underline; color:#FFE47A;}

div#container2 {   
	max-width: 120em;
	width:102em;
    margin: 0 auto;
    font-family: Calibri;
    padding: 0.5em 1em 1em 1em;
	table-layout: fixed;
	overflow-x: auto; 
	/* rounded corners */
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /* gradient */
    background-image: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#808080));
    background-image: -moz-linear-gradient(top, #606060, #808080);
	background-image: -ms-linear-gradient(top, #606060, #808080);
	background-image: linear-gradient(to bottom, #606060, #808080);
    /* box shadows */
    -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
    -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
    box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
    }
div.doubleUp {float:left;
			padding: 0 0.5em;}
/* equal header height so the two floated tables top-align */
div.doubleUp h1 { min-height: 1.5em; }
	
/*** table with team rows ***/
table.teamTable {
    max-width: 100%;
	width:50em;
    border-collapse:collapse;
    text-align:left;
    color: #404040;
    }
		
table.teamTable a {
	display:block;
	}
		
/*** table head ***/
table.teamTable thead tr td  {
    background-color: #efefef;
	text-align:left;
    vertical-align:middle;
    white-space:nowrap;
	padding: 0.25em 0.6em;
    font-size: 1em;
    }
 
table.teamTable thead tr th {
	padding: 0.5em;
	color: #dadada;
	text-shadow: 1px 1px 0 black;
    background-color: #808080;
    background: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#909090));
    background: -moz-linear-gradient(top, #606060, #909090);
	background: -ms-linear-gradient(top, #606060, #909090);
    }

table.teamTable thead th:first-child {text-align:left;}
	
/*** table body ***/

table.teamTable tbody td {
    vertical-align:middle;
	text-align:left;
	padding-top: 0.25em;
	padding-bottom: 0.25em;
	padding-left: 0.6em;
	padding-right: 0.1em;
    }

table.teamTable tbody tr:nth-child(odd) {
    background-color: #fafafa;
	color:#404040;
    }
table.teamTable tbody tr:nth-child(even) {
    background-color: #efefef;
	color:#404040;
    }
table.teamTable tbody tr:last-child {
    border-bottom: solid 1px #404040;
    }

/*** row hover effect  ***/
table.teamTable tbody tr:hover {
	color: #FFE47A;
    background-color: #808080;
    background: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#909090));
    background: -moz-linear-gradient(top, #606060, #909090);
	background: -ms-linear-gradient(top, #606060, #909090);
    }
		
table.teamTable tbody tr:hover a {color:#FFE47A;}

/*** header row ***/
table.teamTable tbody tr.headerrow {
    color: white;
    text-shadow: 1px 1px 0 black;
    background-color: #808080;
    background: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#909090));
    background: -moz-linear-gradient(top, #606060, #909090);
    background: -ms-linear-gradient(top, #606060, #909090);
    font-size: 120%;
    }

/*** separator row ***/
table.teamTable tbody tr.separator {
	color: #dadada;
	text-shadow: 1px 1px 0 black;
    background-color: #808080;
    background: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#909090));
    background: -moz-linear-gradient(top, #606060, #909090);
	background: -ms-linear-gradient(top, #606060, #909090);
    }
 
/*** table footer ***/
    table.teamTable tfoot{
    text-align:center;
    color:#303030;
    text-shadow: 0 1px 1px rgba(255,255,255,0.3);
    } 

th.team {width: 25em;}
th.sm {width: 3em;}
th.mid {width: 6em;}
th.wide {width: 9em;}
	
td.gold {background-color:#D4AF37;
	background: -webkit-gradient(linear, left top, left bottom, from(#D4AF37), to(#DDBF5F));
	background: -moz-linear-gradient(top,#D4AF37,#DDBF5F);
	background: -ms-linear-gradient(top,#D4AF37,#DDBF5F);	
	text-shadow:none;
	color:inherit;}
td.silver {background-color:#C0C0C0;
	background: -webkit-gradient(linear, left top, left bottom, from(#C0C0C0), to(#DDDDDD)); 
	background: -moz-linear-gradient(top,#C0C0C0,#DDDDDD);
	background: -ms-linear-gradient(top,#C0C0C0,#DDDDDD);	
	text-shadow:none;
	color:inherit;}
td.bronze {background-color:#B89470;
	background: -webkit-gradient(linear, left top, left bottom, from(#B89470), to(#C6A98D));
	background: -moz-linear-gradient(top,#B89470,#C6A98D);
	background: -ms-linear-gradient(top,#B89470,#C6A98D);	
	text-shadow:none;
	color:inherit;}

td.tier1 {
    background-color: #F9F9F9;
    background: -webkit-gradient(linear, left top, left bottom, from(#F9F9F9), to(#f2f2f2));
    background: -moz-linear-gradient(top,#F9F9F9,#f2f2f2);
    background: -ms-linear-gradient(top,#F9F9F9,#f2f2f2);
    text-shadow: none;
    color: inherit;
}

td.tier2 {
    background-color: #AEDFF7;
    background: -webkit-gradient(linear, left top, left bottom, from(#AEDFF7), to(#97CCE6));
    background: -moz-linear-gradient(top, #AEDFF7, #97CCE6);
    background: -ms-linear-gradient(top, #AEDFF7, #97CCE6);
    text-shadow: none;
    color: inherit;
}
td.tier3 {
    background-color: #85C1E9;
    background: -webkit-gradient(linear, left top, left bottom, from(#85C1E9), to(#74A9D1));
    background: -moz-linear-gradient(top, #85C1E9, #74A9D1);
    background: -ms-linear-gradient(top, #85C1E9, #74A9D1);
    text-shadow: none;
    color: inherit;
}
td.tier4 {
    background-color: #5DADE2;
    background: -webkit-gradient(linear, left top, left bottom, from(#5DADE2), to(#4F97C1));
    background: -moz-linear-gradient(top, #5DADE2, #4F97C1);
    background: -ms-linear-gradient(top, #5DADE2, #4F97C1);
    text-shadow: none;
    color: inherit;
}
td.tier5 {
    background-color: #3498DB;
    background: -webkit-gradient(linear, left top, left bottom, from(#3498DB), to(#2C7DB5));
    background: -moz-linear-gradient(top, #3498DB, #2C7DB5);
    background: -ms-linear-gradient(top, #3498DB, #2C7DB5);
    text-shadow: none;
    color: inherit;
}

/* Row-hover tint over nonempty cells: these have their own opaque
   background (medal/tier), which paints over the row's grey-gradient
   background, so a plain tr:hover background never reaches them. An
   inset box-shadow layers a faint grey tint on top instead, keeping
   the cell's own color visible underneath (same technique as
   season-index.css's medal-cell hover, extended here to every
   nonempty class). */
.teamTable tr:hover .gold,
.teamTable tr:hover .silver,
.teamTable tr:hover .bronze,
.teamTable tr:hover .tier1,
.teamTable tr:hover .tier2,
.teamTable tr:hover .tier3,
.teamTable tr:hover .tier4,
.teamTable tr:hover .tier5 {
    box-shadow: inset 0 0 0 100px rgba(96,96,96,0.36);
}

/* Hover text when no link */
.teamTable tr:hover .gold  {
    color: #4B3300;
    text-shadow: 1px 1px #4B3300;
}
.teamTable tr:hover .silver {
    color: #2C3539;
    text-shadow: 1px 1px #2C3539;
}
.teamTable tr:hover .bronze {
    color: #330000;
    text-shadow: 1px 1px #330000;
}
.teamTable tr:hover .tier1,
.teamTable tr:hover .tier2,
.teamTable tr:hover .tier3,
.teamTable tr:hover .tier4,
.teamTable tr:hover .tier5 {
    color: #000080;  
    text-shadow: 1px 1px #000000;
}

/* Link color on hover */
.teamTable tr:hover .gold a {
    color: #4B3300;
}
.teamTable tr:hover .silver a{
    color: #2C3539;
}
.teamTable tr:hover .bronze a {
    color: #330000;
}

.teamTable tr:hover .tier1 a,
.teamTable tr:hover .tier2 a {
    color: #000080;
}
.teamTable tr:hover .tier3 a,
.teamTable tr:hover .tier4 a,
.teamTable tr:hover .tier5 a {
    color: #000080;
}

table.teamTable a {
    scroll-margin-top: 14px;
}