/*
	Nike Basketball - The Family
	Author: Scott Kyle
*/

/* RESETS & DEFAULTS */

#page-content, #card {
	font-family : Arial, sans-serif;
	font-size : 12px;
	line-height : 1;
}

#page-content a, #card a {
	cursor : pointer;
	outline : 0;
}

#page-content a:hover, #card a:hover {
	text-decoration : none;
}

.bg, .bg-over, .player {
	position : absolute;
	overflow : hidden;
	background-repeat : no-repeat;
	top : 0;
	left : 0;
	bottom : 0;
	right : 0;
}

.on, .off {
	cursor : default !important;
}

.logo {
	width : 36px;
	height : 36px;
	float : left;
}

.close {
	position : absolute;
	cursor : pointer;
}


/* ROUNDED ELEMENTS */

.round {
	position : relative;
	float : left;
	display : inline;
}

.round .lt, .round .rt {
	position : absolute;
	top : 0;
	height : 100%;
	width : 50%;
}

.round .lt {
	left : 0;
	background : transparent no-repeat left top;
}

.round .rt {
	left : 50%;
	background : transparent no-repeat right top;
}

.round span, .round img {
	position : relative;
}


/* BANNER */

#banner {
	position : relative;
	background-color : #ddd;
	height : 300px;
	z-index : 5;
}

#main-logo {
	position : absolute;
	left : 8px;
	bottom : 20px;
	width : 191px;
	height : 194px;
	background-image : url(../images/family/main_logo.png);
	z-index : 10;
}

#player-info {
	position : absolute;
	top : 241px;
	left : 210px;
	color : #fff;
}

#player-info .name, #player-info a {
	float : left;
}

#player-info .name {
	font-size : 22px;
	font-weight : bold;
	margin-bottom : 5px;
}

#player-info a {
	margin : 3px 6px 0;
	display : none;
}

#player-info .team {
	clear : both;
	display : none;
	text-transform : uppercase;
	font-size : 9px;
}

#banner .bg {
	height : 300px; 	/* Weird IE bug fix */
}

#banner .player {
	left : auto;
	top : auto;
	width : 400px;
	height : 275px;
	display : none;
}


/* STRUCTURE */

#family {
	background : #fff url(../images/family/background.png) no-repeat;
	padding : 9px 7px 10px;
	overflow : hidden;
}

#leagues, #filters {
	float : left;
	overflow : hidden;
	height : 60px;
}

#leagues {
	width : 184px;
	margin-left : 3px;
}

#filters {
	width : 698px;
	margin-left : 8px;
}

#info {
	clear : both;
	height : 44px;
}

#thumbs {
	height : 730px;
}


/* VIEW PROFILE ROUNDED BUTTON */

.profile {
	height : 21px;
	line-height : 19px;
	padding : 0 10px;
	text-transform : uppercase;
	font-size : 11px;
	font-weight : bold;
	color : #000;
}

.profile .lt, .profile .rt {
	background-image : url(../images/family/profile.png);
}


/* PICK A LEAGUE ARROW */

.pickleague {
	height : 30px;
	line-height : 30px;
	padding : 0 10px 0 20px;
	margin-top : 15px;
	text-transform : uppercase;
	font-size : 16px;
	font-weight : bold;
	color : #fff;
}

.pickleague .lt, .pickleague .rt {
	background-image : url(../images/family/pickleague.png);
}


/* FILTER MENUS */

#menu {
	position : absolute;
	right : 0;
	bottom : 0;
	width : 720px;
	padding : 60px 0 25px;
	display : none;
	z-index : 10;
}

#menu-top, #menu-bottom {
	position : absolute;
	left : 0;
	width : 100%;
}

#menu-top {
	top : 0;
	height : 48px;
	background : url(../images/family/menu_top.png) no-repeat left top;
}

#menu-bottom {
	top : 48px;
	bottom : 0;
	background : url(../images/family/menu_bottom.png) no-repeat left bottom;
}

#menu-body {
	position : relative;
	margin : 0 20px;
}

#menu-tip {
	position : absolute;
	bottom : -28px;
	right : 50px;
	width : 73px;
	height : 40px;
	background-image : url(../images/family/menu_tip.png);
}

#menu .close {
	top : 18px;
	right : 23px;
	width : 17px;
	height : 17px;
}

#menu-body .page-bar {
	position : absolute;
	top : -45px;
}

.menu-page {
	overflow : hidden;
}

.menu-column {
	float : left;
}

.menu-item, .page-sel, .num {
	color : #1f5c99;
}

.menu-item {
	cursor : pointer;
	float : left;
}

.menu-column .menu-item {
	float : none; 
}

.menu-column .menu-item .logo {
	margin-right : 5px;
}

.menu-position, .menu-allstar, .menu-name {
	font-size : 20px;
	font-weight : bold;
	text-transform : uppercase;
}

.menu-position, .menu-allstar {
	margin-top : -40px;
	padding-right : 10px;
}

.menu-position .menu-item img {
	display : inline;
	margin-bottom : -6px;
}

.menu-allstar .menu-item, .menu-kicks .menu-item {
	text-align : center;
}

.menu-allstar .menu-item img {
	float : none;
	margin : 10px 0 5px;
}

.menu-college .menu-page, .menu-kicks .menu-page {
	padding-left : 30px;
}

.menu-kicks .menu-item img {
	float : none;
	margin : 0 auto 10px;
}

.menu-name {
	padding : 0 30px;
}

.menu-name .menu-item {
	font-size : 14px;
}

.menu-birthplace .menu-item {
	margin : 4px 0 4px 40px;
}

.menu-team .menu-page {
	padding-left : 140px;
	background-repeat : no-repeat;
	background-position : left top;
}

.menu-team .menu-item, .menu-college .menu-item {
	line-height : 36px;
	height : 36px;
	margin : 0 -10px 0 10px;	/* unwrap text */
}


/* FILTERS */

.filter {
	height : 60px;
	line-height : 60px;
	padding-right : 10px;
	color : #fff;
	font-weight : bold;
	text-transform : uppercase;
	cursor : pointer;
}

#leagues .filter {
	width : 82px;
}

#leagues .filter.active {
	cursor : default;
}

#filters .filter {
	display : none;
}

.filter img {
	float : left;
	margin-top : 4px;
}

.filter span { line-height: normal; float: left; padding: 8px 0 0 5px; }

.filter.hover .lt, .filter.hover .rt {
	background-image : url(../images/family/filter_hover.png);
}

.filter.active .lt, .filter.active .rt {
	background-image : url(../images/family/filter_active.png);
}

.filter.active .close {
	top : 6px;
	right : 4px;
	width : 13px;
	height : 13px;
}


/* PAGE SELECTOR (ROUNDED) */

.page-bar {
	height : 29px;
	padding : 4px 12px 0;
	font-size : 12px;
	text-transform : uppercase;
}

.page-bar .lt, .page-bar .rt {
	background-image : url(../images/family/page_bar.png);
}

.page-sel, .page-left, .page-right {
	float : left;
	position : relative;
	cursor : pointer;
	height : 17px;
}

.page-left, .page-right {
	width : 20px;
}

.page-left {
	background-image : url(../images/family/page_left.png);
	margin-right : 7px;
}

.page-right {
	background-image : url(../images/family/page_right.png);
	margin-left : 7px;
}

.page-left.off {
	background-image : url(../images/family/page_left_off.png);
}

.page-right.off {
	background-image : url(../images/family/page_right_off.png);
}

.page-sel {
	line-height : 18px;
	padding : 0 10px;
	font-weight : bold;
}

.page-sel.on {
	color : #fff;
	background : url(../images/family/page_sel.png) repeat-x;
}

.page-bar.arrows {
	padding : 4px 6px 0;
}

.page-bar.arrows .page-sel {
	padding : 0 7px;
}


/* INFO BAR */

#info .page-bar {
	float : right;
	margin : 9px -3px 0 0;
}

#player-num {
	float : left;
	margin : 15px 0 0 5px;
	font-weight : bold;
	text-transform : uppercase;
}

#player-num .num {
	font-size : 16px;
	margin-right : 4px;
}


/* THUMBS */

.thumb {
	float : left;
	display : none;
	position : relative;
	margin : 0 0 1px 1px;
	width : 111px;
	height : 120px;
}

.thumb .bg {
	background-image : url(../images/family/thumb.jpg);
}

.thumb .bg-over {
	background-image : url(../images/family/thumb_over.jpg);
}

.thumb.big {
	width : 222px;
	height : 240px;
}

.thumb.big .bg {
	background-image : url(../images/family/thumb_big.jpg);
}

.thumb.big .bg-over, #card .bg {
	background-image : url(../images/family/thumb_big_over.jpg);
}

.thumb.big .name {
	background-image : url(../images/family/thumb_name.png);
	left : 0;
	right : 0;
	bottom : 0;
	height : 24px;
	line-height : 24px;
}

#card {
	position : absolute;
	width : 260px;
	height : 337px;
	background : url(../images/family/card.png) center center;
	z-index : 10;
}

#card .player, .thumb.big .player {
	background-position : center top;
}

#card .info, .thumb.big .name {
	position : absolute;
	text-align : center;
	font-weight : bold;
}

#card .info, #card .bg {
	left : 19px;
	right : 19px;
}

#card .bg {
	top : 15px;
	bottom : 82px;
	min-width : 111px;
	min-height : 120px;
}

#card .info {
	top : 260px;
}

#card .name {
	margin-top : 10px;
	font-size : 13px;
}

#card .jersey {
	float : right;
	text-align : right;
	font-size : 16px;
	line-height : 36px;
	width : 36px;
}

#card .profile {
	clear : both;
}


/* NO SCRIPT AND IE6 */

#ie6 {
	display : none;
	margin : 20px;
	font-size : 14px;
}

#ie-link {
	margin : 40px 0;
}

#ie6 a, .league-list a {
	display : block;
	color : #2F638A;
}

#ie6 a:hover, .league-list a:hover {
	text-decoration : underline !important;
}

.league-list {
	clear : both;
}

.league-list h3 {
	margin : 10px 0;
}

.league-list .column {
	float : left;
	width : 25%;
}

.league-list a {
	font-size : 12px;
	margin-left : 10px;
}