/* **********************************************************************************************************************/
/* TEAM COWBOY MAIN SITE STYLESHEET                                                                                     */
/* This file gets minified, so be verbose with comments and style CSS here for maximum readability and maintainability! */
/* **********************************************************************************************************************/

/* *******************************/
/* Core Page Elements and Tags   */
/* *******************************/
html {
	width: 100%;
	height: 100%;
}

body, td {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 12px;
	line-height: 1.3em;
	color: #333;
	padding: 0px;
	margin: 0px;
}

table {
	border: 0;
	border-spacing: 0;
	padding: 0;
}

p { margin: 0 0 10px 0; }
a { font-family: tahoma, verdana, arial, geneva; color: #5F8F47; text-decoration: none; }
a:link, a:visited { color: #5F8F47; }
a:active, a:hover { color: #7FBF5F; }
a.topLink:link, a.topLink:visited { color: #5F8F47; }
a.topLink:active, a.topLink:hover { color: #6A9F4F; }
a.bottomLink { font-weight: bold; }
a.bottomLink:link, a.bottomLink:visited { color: #333; }
a.bottomLink:active, a.bottomLink:hover { color: #666; }
a.hover:hover img, tr.hover:hover, input.hover:hover input { opacity: 0.8; }
wbr:after { content: "\00200B" }
b, .b, .bold { font-weight: bold; }
u, .u { text-decoration: underline; }
form { margin-top: 0em; margin-bottom: 0em; }
input { font-family: tahoma, verdana, arial, geneva, sans-serif; font-size: 12px; padding-left: 3px; }
textarea { font-family: tahoma, verdana, arial, geneva, sans-serif; font-size: 12px; margin-top: 0em; margin-bottom: 0em; padding-left: 3px; }
select { font-family: tahoma, verdana, arial, geneva, sans-serif; font-size: 12px; margin-top: 0em; margin-bottom: 0em; }
ul, ol {
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 25px;
	padding-left: 12px;
	line-height: 1.4em;
}

ul {
	list-style-type: disc;
}

ul li, ol li {
	margin-bottom: 4px;
}

h1, .h1 {
	font-family: tahoma, arial, verdana, geneva, sans-serif;
	font-size: 22px;
	font-weight: bold;
	line-height: 1em;
	color: #0B8D46;
	margin-top: 0px;
	margin-bottom: 7px;
}

h1.teamName {
	font-size: 26px;
}

h2, .h2 {
	font-family: tahoma, arial, verdana, geneva, sans-serif;
	font-size: 18px;
	font-weight: bold;
	line-height: 1em;
	color: #1B187F;
	margin-top: 0px;
	margin-bottom: 7px;
}

h2.moduleBar {
	font-size: 22px;
}

h3, .h3 {
	font-family: tahoma, arial, verdana, geneva, sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.5em;
	color: #444;
	margin-top: 0px;
	margin-bottom: 0px;
}

h4, .h4 {
	font-family: tahoma, arial, verdana, geneva, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.5em;
	color: #444;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* **********************/
/* /Core Page Elements  */
/* **********************/

/* ******************************************************************************/
/* Basic formatting (general modifiers, not specific to certain page elements)  */
/* ******************************************************************************/
.normal {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 12px;
	font-weight: normal;
	font-style: normal;
	line-height: 1.3em;
	color: #333;
}

.normalGray { color: #444; }
.normalGray2 { color: #777; }
.largeText { font-size: 12px; line-height: 1.4em; }.nowrap { white-space: nowrap; }
.hidden { display: none; }
.invisible { visibility: hidden; }
.smallcaps { font-variant: small-caps; }
@media print {
	.hideFromPrint {
		display: none;
	}
}
.valign { vertical-align: middle; }
.valigntop { vertical-align: top; }
.alignleft { text-align: left; }
.aligncenter { text-align: center; }
.alignright { text-align: right; }
.tablecell { display: table-cell; }
.floatleft { float: left; }
.floatright { float: right; }
.clear { clear: both; }
.inline { display: inline; }
.inlineblock { display: inline-block; }
.noborder { border: 0; }
.autocenter { margin-left: auto; margin-right: auto; }
.autovcenter { margin-top: auto; margin-bottom: auto; }
.nomargin { margin: 0px; }
.nopadding { padding: 0px; }
.noParagraphMargin p { margin: 0px; }
.indented { margin-left: 30px; }
.indentedSmall { margin-left: 16px; }
.indentedMedium { margin-left: 22px; }
.indentedBig { margin-left: 42px; }
.indentedSmallIcon { margin-left: 22px; } /* Designed to be the width of a smallIcon (16px) plus right padding/margin, so text under a small icon will line up with the text associated with the icon */
.noTextDecoration:hover { text-decoration: none; }
.iconMargin { margin-right: 5px; }
.iconMarginLeft { margin-left: 5px; }
.noBackground { background: none; }
.inputBig { font-family: tahoma, verdana, arial, geneva, sans-serif; font-size: 14px; font-weight: normal; margin-top: 0em; margin-bottom: 0em; padding-left: 3px; }
.cursorPointer { cursor: pointer; }
.cursorDefault { cursor: default; }
.highlight {
	background-color: #ffff00;
	padding: 3px;
}
.highlightContainer {
	background-color: #ffffcc;
	padding: 5px 8px 7px 8px;
	border: 1px solid #ccc;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.smallText { font-size: 11px; }
.redText, .errorText { color: #cc0000; }
.blueText, .statusText { color: #516AB8; }
.greenText, .successText { color: #006600; }
.grayText, a.grayText, .greyText, .colorDisabled, .disabledText { color: #888; }
.darkGrayText { color: #666; }
.colorNormal { color: #333; }
.statusText, .successText, .errorText { font-weight: bold; }
.orangeText, .invitePending {
	color: #EC9107;
	font-weight: bold;
}


/* Padding and margin */
.topPadding { padding-top: 3px; }
.topPadding2 { padding-top: 6px; }
.bottomPadding { padding-bottom: 3px; }
.bottomPadding2 { padding-bottom: 6px; }
.noLeftPadding { padding-left: 0px; }
.noRightPadding { padding-right: 0px; }
.noSidePadding { padding-left: 0px; padding-right: 0px; }
.topMargin { margin-top: 5px; }
.topMargin2 { margin-top: 10px; }

/* Widget spacers */
.hugeWidgetSpacer { height: 40px; width: 40px; font-size: 1px; line-height: 1px; }
.bigWidgetSpacer { height: 20px; width: 20px; font-size: 1px; line-height: 1px; }
.widgetSpacer { height: 10px; width: 10px; font-size: 1px; line-height: 1px; }
.smallWidgetSpacer { height: 5px; width: 5px; font-size: 1px; line-height: 1px; }
.tinyWidgetSpacer { height: 2px; width: 2px; font-size: 1px; line-height: 1px; }
.smallIcon {
	display: inline-block;
	vertical-align: middle;
	margin-right: 6px;
	margin-bottom: 3px;
}

.smallIcon.less {
	margin-right: 3px;
}

.smallIconLeft {
	display: inline-block;
	vertical-align: middle;
	margin-left: 7px;
	margin-bottom: 3px;
}

.smallIcon.topNudge {
	margin-top: 4px;
}

.smallIcon.bottomNudge {
	margin-bottom: 4px;
}

/* Default rounded corners treatment to use on most containers */
.defaultCorners, #mainContentFrame, .tc_roundedContainer_outer, #loggedOut_masthead_container {
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}

/* Default drop shadow treatment to use on most containers */
.defaultShadow, .tc_roundedContainer_outer, #loggedOut_masthead_container {
	/* Shadow */
	-webkit-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
	-moz-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
	box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
}

.checkboxBottomLabel {
	font-size: 11px;
	color: #888;
	margin-top: 2px;
}

/* ********************/
/* /Basic formatting  */
/* ********************/


/* *****************************************************************/
/* High-level TC Page Elements/Styles (main page containers, etc)  */
/* *****************************************************************/
/*
	The main container is for all content AFTER any full-width top bars (partner branding, new features, notices, etc.)
	This is an important concept because the background starts here and NOT at the top of the page (i.e., on the body tag). If it were
	put on the body tag, then the top bars described above would hide the top part of the background, which is problematic when the background
	is a gradient or has other content at the top that is important to see
*/
#tc_mainContainer {
	width: 100%;
	height: 100%;
	background: url('../images/bg_gradientBlue.gif') #fff repeat-x;
}

/* This is the container for the main module masthead (TC logo, ad, Welcome and module-inspecific links such as Edit Profile and Sign Out) */
#moduleMasthead {
	padding: 0px 5px 0px 5px;

	background: #fff url('../images/masthead/masthead_bg2.gif') bottom center repeat-x;
}

/* Container for the module tabs */
#moduleTabs {
	margin: 10px 10px 0 0;
}

a.moduleTab {
	float: right;
	background-color: #eee;
	border: 1px solid #ccc;
	border-bottom: 2px solid #ddd;
	padding: 5px 8px 5px 8px;
	cursor: pointer;
	margin: 0;
	color: #333;
	font-weight: bold;
	font-size: 13px;
	-webkit-border-radius: 8px 8px 0 0;
	-moz-border-radius: 8px 8px 0 0;
	border-radius: 8px 8px 0 0;
}

a.moduleTab:hover {
	color: #0017a7;
}

a.moduleTab.on {
	background-color: #fff;
	color: #0017a7;
	border-bottom: 2px solid #fff;
}

/* This is the container for the main module-specific bar (for the teams module, it'd be the team name, switch teams menu, teams-module-specific links, etc) */
#moduleBar {
	margin: 0 0 10px 0;
	border: 0;
	
	position: relative; /* Required for absolute positioning of the switch teams menu in the upper-right of the #moduleBar DIV */
	/*
		Important due to IE bug (just IE7 I think and maybe IE 8) with absolute positioning. This is here so that the absolutely-positioned switch teams menu
		will not appear "under" content on the page. This z-index value must be LOWER than the switch teams menu z-index.
	*/
	z-index: 100;
}

/* All content starting below any top bars and below the module masthead (logo, ads, nav tabs, and main page body) are within this container */
/* This should not really have any stylistic CSS, it just serves as a main site-width container for everything inside of it */
#tc_mainContainerInside {
	width: 960px;
	margin: 0 auto 15px auto;
	padding: 10px 15px 15px 15px;
	background-color: #fff;
	border-left: 2px solid #eee;
	border-right: 2px solid #eee;
	border-bottom: 2px solid #eee;
	-webkit-border-radius: 0 0 8px 8px;
	-moz-border-radius: 0 0 8px 8px;
	border-radius: 0 0 8px 8px;
}

#tc_mainContainerInside.loginPage {
	background-color: transparent;
	border: 0;
	margin: 0 auto 0 auto;
}

/* The main content frame is where all of the actual page content resides */
#mainContentFrame {
	border: 1px solid #ddd;
	background-color: #fff;
	background-image: none;
	
	/*
		Shadow -- Note that the offset is larger and the spread is lower. This is intentional, otherwise, the spread
		shows up along the top edge, which is bad because it interferes with the UI of the selected tab flowing into the content area
	*/
	-webkit-box-shadow: 0px 0px 8px 0 rgba(0, 0, 0, .1);
	-moz-box-shadow: 0px 0px 8px 0 rgba(0, 0, 0, .1);
	box-shadow: 0px 0px 8px 0 rgba(0, 0, 0, .1);
}

/* When logged in */
#mainContentFrame.loggedIn {
	border-top: 0;
	padding: 15px 10px 15px 10px;
	
	/* Logged-in version of main frame does not have top-left or top-right rounded corners */
	-webkit-border-radius: 0 0 8px 8px;
	-moz-border-radius: 0 0 8px 8px;
	border-radius: 0 0 8px 8px;
}

/* When logged out, hide border w/rounded corners and turn off box-shadow */
#mainContentFrame.loggedOut {
	border: 0;
	border-bottom: 1px solid #ccc;
	padding: 0 0 15px 0;
	
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

/* For use on login page */
#mainContentFrame.loginPage {
	border: 0;
	background-color: transparent;
	background-image: none;
	
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

/*
	This is used as a spacer on the top-right of the main content frame table so that if the page heading is long,
	it will not extend into the area where the "switch teams" menu is located.
*/
#mainContentFrame_st_spacer {
	width: 153px;
	height: 33px;
}

#tc_mainFooterContainer {
	background: #333;
	border-top: 1px solid #aaa;
	padding: 15px 0 15px 0;
	color: #fff;
}

#loginContainer {
	width: 900px;
	border: 1px solid #ccc;
	margin: 5px auto 5px auto;
	background: #fefefe;
	
	/* Corner rounding */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	
	/* Shadow */
	-webkit-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
	-moz-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
	box-shadow: 0px 0px 10px 0 rgba(0, 0, 0, .15);
}

/* Photo for upper-left of login container. The actual background image source is set from CSS on the page */
#loginContainerPhoto {
	width: 150px;
	height: 207px;
	-webkit-border-radius: 8px 0 0 0;
	-moz-border-radius: 8px 0 0 0;
	border-radius: 8px 0 0 0;
}

.loginHeader {
	border: 2px solid #ddd;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	padding: 8px 8px 8px 8px;
	background: #fafafa;
	font-family: "Trebuchet MS", Calibri, arial, helvetica, sans-serif;
	font-weight: bold;
	color: #0B8D46;
	white-space: nowrap;
	margin-bottom: 10px;
	text-shadow: 1px 1px 2px rgba(255, 255, 255, 1.0); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.loginHeaderContent {
	padding: 0 10px 0 10px;
}

.loginHeaderSpacer { height: 30px; width: 30px; font-size: 1px; line-height: 1px; }

a.loginLaptopTourLink {
	position: absolute; 
	left: 56px;
	bottom: 40px;
	width: 171px;
	height: 20px;
	line-height: 20px;
	display: inline-block;
	background: #fff;
	text-align: center;
	padding: 5px 10px 5px 10px; 
	white-space: nowrap;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border: 1px solid #aaa;
	color: #666;
	font-weight: bold;
	
	/* Shadow */
	-webkit-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
	-moz-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, .2);
	box-shadow: 0px 0px 10px 0 rgba(0, 0, 0, .15);
}

a.loginLaptopTourLink:hover {
	background: #fafafa;
}

.tc_roundedContainer_outer {
	background: #ddd;
	padding: 5px 10px 5px 10px;
	border: 2px solid #ccc;
	
	/* Gradient background (light to dark) */
	background-color: #e6ffe6;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#e6ffe6));
	background-image: -moz-linear-gradient(top,  #efefef,  #e6ffe6);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#e6ffe6');
}

.siteTitle {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #fff;
}

.footer {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 10px;
	line-height: 1.5em;
	text-decoration: none;
	color: #fff;
}

.footer a, .footer a:link, .footer a:visited, .footer td {
	color: #bbb;
}

.footer h3 {
	font-size: 14px;
	font-weight: bold;
	color: #fff;
}

.teamButton {
	margin-right: 10px;
	margin-bottom: 10px;
}

.loginHeader_spacer {
	width: 20px;
}

.loginHeader_vertLine {
	width: 1px;
	height: 80px;
	background-color: #bbb;
}

.loginHeader_tagline {
	font-size: 26px;
	font-weight: bold;
	font-family: tahoma;
	color: #1B187F;
	line-height: 1.2em;
}

#loggedOut_masthead_container {
	border: 1px solid #dedede;
	padding: 10px;
	background: url('../images/bg_gradientBlue2.gif') repeat-x #DEDCF4;
	width: 938px;
	text-align: left;
}

.tc_topBarContainer {
	text-align: center;
	background: #fff;
	border-bottom: 1px solid #ccc;
}

.tc_topBarInner {
	background: #ffffcc url('../images/bg_newFeatures.png') top center repeat-x;
}

.tc_topBarContent {
	padding: 10px 10px 10px 10px;
	margin: auto;
}

#tc_topBarDetails {
	text-align: left;
}

#tc_topBarDetails a {
	color: #0017A7;
}

/*
The two footer classes are used as a faux drop shadow.
We cannot use CSS3 drop shadows here b/c the main site container (#tc_mainContainer) is typically after the top bar
and it has a background, and if following elements have backgrounds, they cancel out the previous element's drop shadows.
Not sure why, but that's what my testing showed.
*/
.tc_topBarFooter1 {
	background: #fff;
	border-bottom: 1px solid #ccc;
}

.tc_topBarFooter2 {
	background: #fff;
	border-bottom: 1px solid #ddd;
}

#tc_partnerBarContainer {
	text-align: center;
	border-bottom: 1px solid #ccc;
}

#mastheadHeaderLinks {
	margin: 10px 10px 0 10px;
	line-height: 1.4em;
	white-space: nowrap;
	font-size: 12px;
}

.adContainer {
	margin: 0 0 0 0;
}

.adBorder {
	display: inline-block;
	border: 1px solid #ccc;
	padding: 1px;
}

.browserUpgrade {
	background: #ffffcc;
	border-bottom: 1px solid #ccc;
	padding: 8px;
	text-align: center;
	margin-top: -10px;
	margin-left: -8px;
	margin-right: -8px;
}

#profileLabel {
	background-color: #ffffcc;
	padding-bottom: 2px;
	border-bottom: 1px solid #ccc;
}
/* *****************************************************************/
/* /High-level TC Page Elements (main page containers, etc)        */
/* *****************************************************************/

/* **************************/
/* Event Schedule Display   */
/* **************************/
.tc_scheduleRow_selectionIndicator_on {
	border-left: 2px solid blue;
}

.tc_scheduleRow_selectionIndicator_off {
	border-left: none;
}

.tc_eventScheduleNavContainer {
	padding: 7px;
	background: #fafafa;
	border-bottom: 1px solid #eee;
}

.tc_scheduleSectionBar {
	font-size: 12px;
	font-weight: normal;
	color: #000;
	line-height: 16px;
	background: url('../images/bg_gradientGray2.gif') #eee repeat-x;
	border-top: 1px solid #eee;
	border-left: 1px solid #eee;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	padding: 3px 8px 4px 8px;
	cursor: pointer;
}

.tc_scheduleRow {
	padding-bottom: 5px;
}

.tc_scheduleRow_text {
	font-size: 12px;
}

.tc_scheduleRow_smallText {
	font-size: 11px;
	color: #333;
}

.tc_scheduleRow_teamName {
	font-size: 14px;
	font-weight: bold;
}

.tc_scheduleRow_previousNextEvent {
	font-size: 12px;
	font-weight: bold;
	color: #333;
}

.tc_scheduleRow_gameFuture {
	background-color: #fff;
}

.tc_scheduleRow_gamePast, .tc_scheduleRow_gameRecent {
	background-color: #efefef;
	background: none;
}

.tc_scheduleRow_selectedRow {
	background-color: #D7E7F9;
}

.tc_nextEvent_teamName {
	font-size: 14px;
	font-weight: bold;
	color: #333;
}

.tc_nextEvent_text {
	font-size: 12px;
	font-weight: normal;
	color: #333;
}

.tc_calEventDetails_eventInfo {
	font-size: 14px;
	font-weight: bold;
	line-height: 1.5em;
	color: #444;
}

.tc_calEventDetails_dateTimeInfo {
	font-weight: bold;
}

.tc_calEventDetails_statusFlag {
}

.tc_calEventDetails_locationInfo {
	font-weight: bold;
}

.tc_calEventDetails_locationInfoAddress {
	
}

.tc_calEventDetails_comments {
	
}
/* ********************/
/* /Schedule Display  */
/* ********************/

/* ********************/
/* Icons              */
/* ********************/
.icon {
	/* By default, icons are assumed to be 16x16. Dimensions can be customized per-icon where the icon is defined. */
	width: 16px;
	height: 16px;
	border: 0;
	background-image: url(../images/icons/iconSprite.png);
	background-repeat: no-repeat;
}

/* Define icons */
.icon.tick { background-position: 0 0; }
.icon.tickSmall, .icon.ajaxSuccess { background-position: -32px 0; }
.icon.error, .icon.ajaxError { background-position: -48px 0; }
.icon.ajaxProgress { background: url(../images/ajax/ajax_arrows2.gif); }

/* ********************/
/* Icons              */
/* ********************/

/* ********************/
/* Sprites            */
/* ********************/
.tc_sprite {
	background: url('../images/sprite-01.png') transparent no-repeat;
}

.tc_sprite.icon32 {
	width: 32px;
	height: 32px;
}

.tc_sprite.icon32.fbCircle {
	background-position: 0 0;
}

.tc_sprite.icon32.twCircle {
	background-position: -32px 0;
}

.tc_sprite.icon32.gplusCircle {
	background-position: -96px 0;
}

.tc_sprite.icon32.pinterestCircle {
	background-position: -128px 0;
}

.tc_sprite.mbGooglePlay {
	width: 130px;
	height: 45px;
	background-position: 0 -41px;
}

.tc_sprite.mbAppStore {
	width: 130px;
	height: 45px;
	background-position: 0 -86px;
}

.tc_sprite.mbWinPhone {
	width: 130px;
	height: 45px;
	background-position: 0 -131px;
}

/* ********************/
/* /Sprites           */
/* ********************/


/* ********************/
/* Dashboard          */
/* ********************/
.tc_teamButton_teamName {
	font-size: 14px;
	font-weight: bold;
	color: #333;
	margin-top: 5px;
}

.tc_teamButton_noPhoto {
	width: 100px;
	height: 100px;
}

.tc_teamButton_noPhotoText {
	font-size: 11px;
	font-weight: bold;
	color: #999999;
}
/* ********************/
/* /Dashboard         */
/* ********************/

/* ****************/
/* Data Lists     */
/* ****************/
.dataList_row_0, .dataList_row_darker_0 { background-color: #fff; }
.dataList_row_1 { background-color: #FBFBFB; }
.dataList_row_darker_1 { background-color: #eee; }
.dataList_row_dis { background-color: #FFDFE0; }
.dataList_row_error { background-color: #FFC0C0; }
.dataList_row_selected, .dataList_row_hover, .dataList_row_0:hover, .dataList_row_1:hover  { background-color: #ffffcc; }
.dataList_thinRowDivider { height: 1px; background-color: #ccc; }

.dataList_headingCell {
	font-size: 13px;
	font-weight: bold;
	vertical-align: bottom;
	color: #333;
	background-color: #eee;
	background: none;
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 1px solid #eee;
}

.dataList_headingCell_small {
	font-size: 11px;
	font-weight: bold;
	vertical-align: bottom;
	color: #333;
	background-color: #eee;
	background: none;
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 1px solid #eee;
}

.dataList_headingCellBottom {
	border-bottom: none;
}

.dataList_dataCell {
	font-size: 12px;
	font-weight: normal;
	color: #000;
	border-bottom: 1px solid #eee;
	padding: 5px 8px 5px 8px;
}

.dataList_dataCell_firstCol {
	border-left: 1px solid #eee;
}

.dataList_dataCell_lastCol {
	border-right: 1px solid #eee;
}

.dataList_dataCell.lastRow, .dataList_dataCellBottom, .dataList_dataCell.noBottomBorder {
	border-bottom: none;
}

.dataList_dataCell_noBorder {
	border: 0;
}

.tc_dataList_dataCell_unselected {
	border-top: 2px solid #fff;
	border-bottom: 2px solid #fff;
}

.tc_dataList_dataCell_selected_topBottom {
	border-top: 2px solid #0099FF;
	border-bottom: 2px solid #0099FF;
}

.tc_dataList_dataCell_selected_left {
	border-left: 3px solid #0099FF;
}

.tc_dataList_dataCell_selected_right {
	border-right: 2px solid #0099FF;
}

.tc_dataList_dataCell_gamePast, .tc_dataList_dataCell_gameRecent {
	border-bottom: 1px solid #ddd;
	color: #333;
}

.tc_dataList_dataCell_gameRSVP {
	background-color: #D7E7F9;
	border-bottom: 0px;
}

.dataList_smallText { font-size: 10px; }

.dataList_text {
	font-size: 12px;
	font-weight: normal;
	color: #000;
}
/* ****************/
/* /Data Lists    */
/* ****************/

/* ******************/
/* Event RSVPing    */
/* ******************/
/* Colors for RSVP status displays (primarily in the RSVP box and in the event schedule output) */
.tc_gameRSVP_playing { color: #009900; }
.tc_gameRSVP_notplaying { color: #bb0000; }
.tc_gameRSVP_noshow { color: #bb0000; }
.tc_gameRSVP_tentative, .tc_gameRSVP_available { color: #111; }
.tc_gameRSVP_noresponse { color: #444; }

#divPlayerRSVPInstanceName {
	font-weight: bold;
	font-size: 1.1em;
}

/* ******************/
/* /Event RSVPing   */
/* ******************/

/* ******************/
/* Score Display    */
/* ******************/
.tc_scoreDisplay_win {
	color: green;
	font-weight: bold;
}

.tc_scoreDisplay_loss {
	color: red;
	font-weight: bold;
}

.tc_scoreDisplay_tie {
	color: #333;
	font-weight: bold;
}

.tc_scoreDisplay_prefix {
	color: #333;
	font-weight: bold;
}
/* ******************/
/* /Score Display   */
/* ******************/


/* ******************/
/* Attendance List  */
/* ******************/
.tc_attListMainHeader {
	font-size: 12px;
	font-weight: bold;
	vertical-align: middle;
	background: url('../images/bg_gradientGray2.gif') #ddd repeat-x;
	color: #333;
	margin: 0px;
	padding: 5px 8px 3px 8px;
	border-bottom: 1px solid #ddd;
	white-space: nowrap;
}

.tc_attListSectionHeader {
	font-size: 12px;
	font-weight: normal;
	color: #000;
	border-bottom: 1px solid #eee;
	padding: 5px 8px 3px 8px;
	white-space: nowrap;
	margin-right: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tc_attListPerson {
	font-size: 11px;
	font-weight: normal;
	color: #000;
	border-bottom: 1px solid #eee;
	padding: 4px 3px 4px 0px;
	vertical-align: middle;
}

#attendanceListFootnote {
	font-size: 11px;
	color: #888;
}
/* ******************/
/* /Attendance List */
/* ******************/


/* **************************************/
/* Content Boxes and Content Box Tabs   */
/* **************************************/
/* Main container */
.cb {
	/*
	Note that bottom margin is 12px, not 10px (standard widget size).
	It is larger on purpose to account for visual effect of a smaller gap caused by the drop shadow
	TAS 1/30/2012 -- drop shadow removed, so margin put back to standard 10px widget size
	*/
	margin: 0 0 10px 0;
	
	/* Corner rounding */
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
	
	/* Shadow (bottom-right) */
	/* <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? */
	/*
	-webkit-box-shadow: 1px 1px 4px 0 #ddd;
	-moz-box-shadow: 1px 1px 4px 0 #ddd;
	box-shadow: 1px 1px 5px 0 #ddd;
	*/
}

/* This is meant to be used a standalone class for a simple, bordered content box with padding */
.cbPlain {
	border: 1px solid #ddd;
	padding: 8px 12px 8px 12px;
	margin: 0 0 12px 0;
	background: #fff;
	
	/* Corner rounding */
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 5px 5px;
	
	/* Shadow (bottom-right) */
	/* <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? */
	/*
	-webkit-box-shadow: 1px 1px 4px 0 #ddd;
	-moz-box-shadow: 1px 1px 4px 0 #ddd;
	box-shadow: 1px 1px 5px 0 #ddd;
	*/
}

/*
If the option for the content box has padding turned off, surrounding content with this class will add that padding back in
The padding here should match the padding for the .cbPlain class!
 */
.cbPadding {
	padding: 8px 12px 8px 12px;
}

.cbPlain.hover {
	background-color: #ffffcc;
}

/* Heading bar (normal) */
.cbHeadingBar {
	position: relative;
	height: 26px;
	line-height: 26px;
	background: url('../images/bg_cb_heading.gif') #E3E1F5 repeat-x;
	padding: 0px 6px 0px 9px;
	border-bottom: 1px solid #ccc;
	
	/* Corner rounding on top-left and top-right */
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}

/* Designed for a 16x16px icon on the far right side of the heading bar */
.cbHeadingBarIconBox {
	display: none;
	position: absolute;
	right: 5px;
	top: 3px;
	width: 20px;
	height: 20px;
	border: 0;
	
	/* This is a nice rounded-rectangle box with PNG transparency to "frame" whatever icon gets put in the box */
	/* This is done so that the icon will show up in the box nicely, regardless of the heading bar background color (light or dark) */
	background: url(../images/roundBoxWhite.png) 0 0 no-repeat;
	
	/* Shadow for the box */
	-webkit-box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, .2);
	-moz-box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, .2);
	box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, .2);
}

.cbHeadingBarIconBox.on {
	display: block;
}

/* Optional label that appears to the left of the icon */
.cbHeadingBarIconBox .iconLabel {
	position: absolute;
	right: 25px;
	top: 1px;
	font-size: 10px;
}

/* Icon element (e.g., Div) within the icon box */
.cbHeadingBarIconBox .icon {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	top: 2px;
	left: 2px;
}

/* Heading text/links */
.cbHeadingBar, .cbHeadingBar a, .cbHeadingText, a.cbHeadingText {
	font-family: arial, tahoma, verdana, arial, geneva, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #333;
	line-height: 26px;
	white-space: nowrap;
	text-decoration: none;
	text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.cbHeadingBar .rightContent {
	display: inline-block;
	height: 26px;
	line-height: 26px;
	margin: 0px 4px 0 0;
}

.cbHeadingBar .rightContent, .cbHeadingBar .rightContent a {
	font-size: 12px;
	font-weight: normal;
}

.cbHeadingBar .rightContent select {
	margin-top: -5px;
}

.cbHeadingBar .rightContent a:hover {
	text-decoration: underline;
}

a.cbHeadingText:hover {
	color: #666;
}

/* Content container (normal) */
.cbContent {
	border: 1px solid #ddd;
	border-top: none; /* Normally the content will have a header, so we don't also want a top border on the content class */
	padding: 12px 8px 12px 8px;

	
	/* Corner rounding on bottom-left and bottom-right only (default) */
	-webkit-border-radius: 0 0 8px 8px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 8px 8px;
}

.cbContent.noHeadingBar {
	border-top: 1px solid #ddd;
	
	/* Corner rounding on all sides */
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}

/* No padding */
.cbContent.noPadding {
	padding: 0;
}

/* No side padding */
.cbContent.noSidePadding {
	padding-left: 0;
	padding-right: 0;
}

/* No top padding */
.cbContent.noTopPadding {
	padding-top: 0;
}

.cbContent.noBorders {
	border: 0;
}

.cbContent.noTopBorder {
	border-top: 0;
	
	/* Corner rounding on bottom-left and bottom-right only */
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}

/* This is here as a hack/workaround for IE6-7. For some reason, if there is not content after the main cb container, 
show/hide doesn't work properly and messes up the page flow. Try removing the height from this CSS to see the problem in action. */
.cbBottom {
	height: 1px;
}

/* Container for content box tabs */
.cbTabSet {
	
}

.cbTabSet:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* Context box tab (default "off" state) */
.cbTab {
	float: left;
	border: 1px solid #ddd;
	padding: 7px 10px 7px 10px;
	margin: 0 1px 0 0;
	font-size: 12px;
	font-weight: bold;
	background-color: #efefef;
	text-align: center;
	white-space: nowrap;
	width: auto;
	
	/* Corner rounding */
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}

/* Context box tab ("on" state) */
.cbTab.on {
	border-bottom: 1px solid #fff; /* Use #fff here, not 'transparent', as the latter doesn't work in IE < 9 */
	background-color: #fff;
}

/* This is used to fill the space to the right of the tabs so that we still get a border above the content box */
.cbTab.spacer {
	float: none;
	background-color: #fff;
	border: 1px solid #fff;
	border-bottom: 1px solid #ddd;
}
/* **************************************/
/* /Content Boxes and Content Box Tabs  */
/* **************************************/


/* ***************/
/* Forms         */
/* ***************/
.formHeading {
	font-size: 11px;
	font-weight: bold;
	color: #000;
	border: 0px solid #ddd;
	padding: 0px 2px 0px 0px;
	text-align: right;
}

.formHeadingBig {
	font-size: 13px;
	font-weight: bold;
}

.formHeadingLeft {
	text-align: left;
	padding: 0px 0px 0px 4px;
}

.formHeadingCenter {
	text-align: center;
	padding: 0px 2px 0px 2px;
}

.formHeadingHighlight {
	background-color: #ffffcc;
	border-bottom: 1px dotted #333;
}

.formText {
	font-size: 11px;
	padding: 0px 8px 0px 4px;
}

.formTextLeft {
	font-size: 11px;
	padding: 0px 0px 0px 2px;
}

.formTextBig {
	font-size: 13px;
}

.formRowSpacer {
	height: 8px;
}

.formRowSpacerSmall {
	height: 4px;
}

.formFieldNote {
	color: #666;
	padding-top: 2px;
}

.formHelperText {
	font-size: 1em;
	color: #505050;
}
/* ***************/
/* /Forms        */
/* ***************/

/* **************************/
/* Top Navigation/Nav Tabs  */
/* **************************/
#navContainer {
	position: relative;
	height: 24px;
	margin-top: 5px;
	z-index: 90; /* This needs to be BELOW the switch teams menu! Otherwise, the ST menu will trigger mouseout since this will be on top of it */
	background: url('../images/nav/nav_bg_v3.1.gif') repeat-x;	
}

ul#topNav {
	display: block;
	list-style-type: none;
	margin: 0;
	padding: 0;
	
}

ul#topNav > li {
	display: block;
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	margin-right: 1px;
}

/* TEAMS: HOME */
ul#topNav > li#topNav_teams_home > a {
	display: block;
	width: 68px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -288px;
}
ul#topNav > li#topNav_teams_home > a:hover { background-position: -202px -288px; }
ul#topNav > li#topNav_teams_home.modSec_teams_home > a { background-position: -405px -288px; }

/* TEAMS: ROSTER */
ul#topNav > li#topNav_teams_roster > a {
	display: block;
	width: 70px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -36px;
}
ul#topNav > li#topNav_teams_roster > a:hover { background-position: -202px -36px; }
ul#topNav > li#topNav_teams_roster.modSec_teams_roster > a { background-position: -405px -36px; }

/* TEAMS: SCHEDULE */
ul#topNav > li#topNav_teams_schedule > a {
	display: block;
	width: 85px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -72px;
}
ul#topNav > li#topNav_teams_schedule > a:hover { background-position: -202px -72px; }
ul#topNav > li#topNav_teams_schedule.modSec_teams_schedule > a { background-position: -405px -72px; }

/* TEAMS: RSVPs */
ul#topNav > li#topNav_teams_rsvps > a {
	display: block;
	width: 70px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -108px;
}
ul#topNav > li#topNav_teams_rsvps > a:hover { background-position: -202px -108px; }
ul#topNav > li#topNav_teams_rsvps.modSec_teams_rsvps > a { background-position: -405px -108px; }

/* TEAMS: PHOTOS & FILES */
ul#topNav > li#topNav_teams_photosFiles > a {
	display: block;
	width: 154px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -360px;
}
ul#topNav > li#topNav_teams_photosFiles > a:hover { background-position: -202px -360px; }
ul#topNav > li#topNav_teams_photosFiles.modSec_teams_photosFiles > a { background-position: -405px -360px; }
/* Override width (otherwise menu items are narrower than the button itself which looks odd */
ul#topNav > li#topNav_teams_photosFiles ul.subNav {
	width: 170px;
}

/* TEAMS: MESSAGE BOARD */
ul#topNav > li#topNav_teams_messageBoard > a {
	display: block;
	width: 118px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -180px;
}
ul#topNav > li#topNav_teams_messageBoard > a:hover { background-position: -202px -180px; }
ul#topNav > li#topNav_teams_messageBoard.modSec_teams_messageBoard > a { background-position: -405px -180px; }

/* TEAMS: SURVEYS */
ul#topNav > li#topNav_teams_surveys > a {
	display: block;
	width: 78px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -216px;
}
ul#topNav > li#topNav_teams_surveys > a:hover { background-position: -202px -216px; }
ul#topNav > li#topNav_teams_surveys.modSec_teams_surveys > a { background-position: -405px -216px; }

/* TEAMS: PAYMENT TRACKER */
ul#topNav > li#topNav_teams_payments > a {
	display: block;
	width: 90px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -144px;
}
ul#topNav > li#topNav_teams_payments > a:hover { background-position: -202px -144px; }
ul#topNav > li#topNav_teams_payments.modSec_teams_payments > a { background-position: -405px -144px; }

/* TEAMS: TEAM STORE */
ul#topNav > li#topNav_teams_teamStore > a {
	display: block;
	width: 65px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -576px;
}
ul#topNav > li#topNav_teams_teamStore > a:hover { background-position: -202px -576px; }
ul#topNav > li#topNav_teams_teamStore.modSec_teams_teamStore > a { background-position: -405px -576px; }

/* TEAMS: TEAM SETTINGS */
ul#topNav > li#topNav_teams_settings > a {
	display: block;
	width: 113px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -252px;
}
ul#topNav > li#topNav_teams_settings > a:hover { background-position: -202px -252px; }
ul#topNav > li#topNav_teams_settings.modSec_teams_settings > a { background-position: -405px -252px; }


/* MATCH UP: FIND TEAMS */
ul#topNav > li#topNav_matchUp_findTeams > a {
	display: block;
	width: 140px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -396px;
}
ul#topNav > li#topNav_matchUp_findTeams > a:hover { background-position: -202px -396px; }
ul#topNav > li#topNav_matchUp_findTeams.modSec_matchUp_findTeams > a { background-position: -405px -396px; }

/* MATCH UP: FIND PLAYERS */
ul#topNav > li#topNav_matchUp_findPlayers > a {
	display: block;
	width: 190px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -432px;
}
ul#topNav > li#topNav_matchUp_findPlayers > a:hover { background-position: -202px -432px; }
ul#topNav > li#topNav_matchUp_findPlayers.modSec_matchUp_findPlayers > a { background-position: -405px -432px; }

/* MATCH UP: MANAGE PROFILES */
ul#topNav > li#topNav_matchUp_manageProfiles > a {
	display: block;
	width: 124px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -468px;
}
ul#topNav > li#topNav_matchUp_manageProfiles > a:hover { background-position: -202px -468px; }
ul#topNav > li#topNav_matchUp_manageProfiles.modSec_matchUp_manageProfiles > a { background-position: -405px -468px; }

/* MATCH UP: ADD PROFILE */
ul#topNav > li#topNav_matchUp_addProfile > a {
	display: block;
	width: 182px;
	height: 24px;
	background: url('../images/nav/navTabs_all_v7.png') no-repeat;
	background-position: 0px -504px;
}
ul#topNav > li#topNav_matchUp_addProfile > a:hover { background-position: -202px -504px; }
ul#topNav > li#topNav_matchUp_addProfile.modSec_matchUp_addProfile > a { background-position: -405px -504px; }

/* Sub-navigation menu styles */
ul#topNav ul.subNav {
	position: absolute;
	top: 24px;
	left: -1px; /* We are starting this slightly to the left to account for the thicker border */
	/*min-width: 300px;*/
	background: #fff;
	border-top: 1px solid #ddd;
	border-left: 2px solid #ddd;
	border-bottom: 2px solid #ddd;
	border-right: 2px solid #ddd;
	list-style-type: none;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	display: none; /* Hidden by default, shown on parent tab hover */
	
	/* Rounded corners */
	border-radius: 0px 8px 8px 8px;
	-moz-border-radius: 0px 8px 8px 8px;
	-webkit-border-radius: 0px 8px 8px 8px;
	
	/* Drop shadow */
	-webkit-box-shadow: 3px 3px 8px 0px rgba(100, 100, 100, .2);
	-moz-box-shadow: 3px 3px 8px 0px rgba(100, 100, 100, .2);
	box-shadow: 3px 3px 8px 0px rgba(100, 100, 100, .2);
}

ul#topNav ul.subNav li {
	display: block;
	margin: 0;
	padding: 0;
}

ul#topNav ul.subNav li a {
	display: block;
	background: #fff;
	margin: 0;
	padding: 5px 10px 5px 10px;
	border-top: 1px solid transparent; /* We need a transparent border here so that when the hover adds a visible border, there is no "shift" due to the height of the element changing */
	border-bottom: 1px solid #eee;
	color: #444;
	text-align: left;
}

ul#topNav ul.subNav li a:hover {
	background: #e9e9e9;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 1.0); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

/* Adjust border radiuses for first and last elements so background color doesn't cover up rounded corner */
ul#topNav ul.subNav li:first-child a {
	border-top: 0;
	
	/* Override corner rounding. Note that we are using a smaller radius here than the main container. 
	This is to compensate for the thicker border on the main container */
	border-radius: 0px 5px 0px 0px;
	-moz-border-radius: 0px 5px 0px 0px;
	-webkit-border-radius: 0px 5px 0px 0px;
}

ul#topNav ul.subNav li:last-child a {
	border-bottom: 0;
	
	/* Override corner rounding. Note that we are using a smaller radius here than the main container. 
	This is to compensate for the thicker border on the main container */
	border-radius: 0px 0px 5px 5px;
	-moz-border-radius: 0px 0px 5px 5px;
	-webkit-border-radius: 0px 0px 5px 5px;
}

/* Set positioning. This is so that the shield icon will properly sit on the right side of the menu item without wrapping */
/* In most browsers, doing a simple float: right on the icon works, but not in IE, so that's why we're doing it this way. */
ul#topNav ul.subNav li a {
	position: relative;
	padding-right: 35px; /* This leaves room for the shield icon if it's present. Otherwise, it's just extra space which isn't a big deal */
}

ul#topNav ul.subNav li a img.shieldIcon {
	position: absolute;
	top: 5px;
	right: 7px;
}
/* **************************/
/* /Top Navigation/Nav Tabs */
/* **************************/

/* ******************************/
/* Miscellaneous Site-specific  */
/* ******************************/
a.teamName:link, a.teamName:visited, a.teamName:active {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 28px;
	font-weight: bold;
	line-height: 1.2em;
	color: #0B8D46;
	text-decoration: none;
}

a.teamName:hover {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 28px;
	font-weight: bold;
	line-height: 1.2em;
	color: #0B8D46;
	text-decoration: underline;
}

.rsvpLabel {
	font-size: 11px;
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	padding-left: 2px;
}

.rsvpExtra {
	font-style: italic;
	color: #666666;
}

.rsvpExtraBox {
	border: 1px solid #ccc;
	padding-left: 3px;
	font-size: 10px;
	background-color: #EAF1F9;
}

.rsvpComments {
	font-size: 11px;
	color: #444444;
}

.rsvpPlayerName {
	color: #006600;
	text-decoration: underline;
}

.photoBorder {
	border: 1px solid #ddd;
	background: #fff;
	padding: 3px;
	display: inline-block;
}

.photoBorder.roundedCorners {
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}

.photoBorder.roundedCorners img {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.widgetItem_heading {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #444444;
	margin-top: 0px;
	margin-bottom: 3px;
}

.widgetItem_teamName a {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #999999;
	margin-top: 4px;
	margin-bottom: 5px;
}

.calIcon {
	cursor: pointer;
	vertical-align: middle;
}

.tc_rowHover {
	background-color: #ffffdd;
}

.captcha {
	border: 1px solid #999999;
	margin-right: 5px;
}
/* ******************************/
/* /Miscellaneous               */
/* ******************************/


/* ***********************/
/* Message board         */
/* ***********************/
.mb_title {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #1B187F;
	margin-top: 0px;
	margin-bottom: 5px;
	line-height: 1.2em;
}

.mb_title_teamName, .mb_title_teamName a {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #999999;
}

.mb_body {
	font-size: 13px;
	color: #333;
	background: #f0f0f0;
	border: 1px solid #ddd;
	padding: 8px 8px 8px 8px;
	margin-top: 5px;
}

.mb_postedBy {
	font-size: 11px;
	font-style: italic;
	color: #777777;
	margin-top: 3px;
}

.mb_commentPostedBy {
	font-size: 11px;
	font-style: italic;
	color: #777777;
	margin-bottom: 15px;
	margin-top: 3px;
}

.mb_postCommentHeading {
	font-size: 15px;
	color: #333;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 5px;
}

.mb_commentsContainer {
	margin-top: 10px;
}

.mb_postComment {
	margin-top: 0px;
}
/* ***********************/
/* /Message board styles */
/* ***********************/

/* *******************/
/* Payment Tracker   */
/* *******************/
.ptBalance_positive {
	color: #009900;
	font-weight: bold;
}

.ptBalance_negative {
	color: #cc0000;
	font-weight: bold;
}

.ptBalance_neutral {
	color: #000000;
	font-weight: bold;
}
/* *******************/
/* /Payment Tracker  */
/* *******************/


/* ************************/
/* Hoverbox/Hover Icon    */
/* ************************/
/*
SAMPLE HTML STRUCTURE

<div class="hoverbox align_middle">
	<div class="hoverbox_image icon_help"></div>
	<div class="hoverbox_contents">
		<div class="hoverbox_title">
			Title here
		</div>
		<div class="hoverbox_body">
			Body contents here
		</div>
	</div>
</div>
*/
.hoverbox {
	display: inline-block;
	position: relative;
	width: 16px;
	height: 16px;
	
	/* So that inline-block works properly in IE6-7 */
	zoom: 1;
	*display: inline;
	_height: 16px;
}

.hoverbox.align_top {
	vertical-align: top;
}

.hoverbox.align_middle {
	vertical-align: middle;
}

.hoverbox_image {
	position: absolute;
	z-index: 10;
}

.hoverbox_image.icon_help {
	background: url('../images/icons/help.gif') no-repeat;
	width: 16px;
	height: 16px;
}

.hoverbox_contents {
	position: absolute;
	top: 0;
	left: 0;
	text-align: left;
	width: 250px;
	display: none;
	z-index: 20;
}

.hoverbox_title {
	white-space: normal;
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-weight: bold;
	font-size: 12px;
	color: #333;
	border: 1px solid #A5CFE9;
	padding: 2px 6px 2px 8px;
	background-color: #D5EBF9;
	
	border-radius: 8px 8px 0 0;
	-moz-border-radius: 8px 8px 0 0;
	-webkit-border-radius: 8px 8px 0 0;
}
 
.hoverbox_body {
	white-space: normal;
	border-bottom: 1px solid #A5CFE9;
	border-left: 1px solid #A5CFE9;
	border-right: 1px solid #A5CFE9;
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 11px;
	font-weight: normal;
	line-height: 1.1em;
	padding: 6px 6px 8px 8px;
	color: #1B4966;
	background-color: #fff;
	
	border-radius: 0 0 8px 8px;
	-moz-border-radius: 0 0 8px 8px;
	-webkit-border-radius: 0 0 8px 8px;
}

.hoverbox_body a {
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-size: 12px;
}
/* ************************/
/* /Hoverbox (hover icon) */
/* ************************/


/* ******************/
/* Surveys          */
/* ******************/
.surveyQuestionText {
	border: 1px solid #ccc;
	background-color: #ccccff;
	padding: 5px;
	padding-left: 8px;
	font-weight: bold;
	font-size: 14px;
	
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}

.surveyQuestionAnswers {
	font-weight: bold;
	font-size: 12px;
	margin-bottom: 20px;
}

.surveyQuestionChart {
	width: 600px;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #ddd #aaa #aaa #ddd;
	padding: 20px;
}

.surveyResultsQuestionSummary {
	color: #333;
}
/* ******************/
/* /Surveys         */
/* ******************/

/* **********************/
/* Progress Bar         */
/* **********************/
.progressBarTitle {
	width: 180px;
	padding-top: 2px;
}

.progressBarSubTitle {
	color: #888;
}

.progressBarContainer {
	position: relative;
	width: 195px;
	height: 17px;
	border: 1px solid #ccc;
	border-color: #ccc #aaa #aaa #ccc;
	border-color: #ccc;
	margin-left: 10px;
}

.progressBarContainer img.progressBar {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 0px;
	height: 17px;
}

.progressBarSpaceDetails {
	white-space: nowrap;
	color: #888;
	padding-top: 2px;
}
/* **********************/
/* /Progress Bar        */
/* **********************/


/* *************************** */
/* Switch Teams Dropdown Menu */
/* *************************** */
#st_container {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 113px;
	/*
		Important due to IE bug (just IE7 I think and maybe IE 8) with absolute positioning. This is here so that the absolutely-positioned switch teams menu
		will not appear "under" content on the page. This z-index value must be HIGHER than the #mainContnetFrame z-index.
	*/
	z-index: 200;
}

#st_menu {
	position: absolute;
	top: -10px; /* Negative values are b/c the menu is inside a container that has padding, but we want it aligned with the edge of that container */
	right: -10px;
	background: url("../images/buttons/b_sm_switchTeam.gif") no-repeat;
	width: 113px;
	height: 22px;
	cursor: pointer;
	z-index: 900;
}

#st_menu_spacer {
	width: 1px;
	height: 32px;
}

#st_items_container {
	display: none;
	position: absolute;
	top: 11px;
	right: -9px;
	width: 300px;
	z-index: 899;
	border: 8px solid #ddd;
	background: #fff;
	
	/* Corner rounding */
	-webkit-border-radius: 8px 4px 8px 8px;
	-moz-border-radius: 8px 4px 8px 8px;
	border-radius: 8px 4px 8px 8px;
}

#st_items_headerContent {
	margin: 7px 5px 0px 10px;
	padding-bottom: 5px;
	font-size: 11px;
	text-align: left;
}

.st_item_container {
	border-top: 1px solid #eee;
	padding: 5px 8px 5px 8px;
	text-align: left;
	cursor: pointer;
	background: #fff;
}

.st_item_container:hover {
	background: #f3f3f3;
}

.st_item_photo_float {
	position: relative;
	float: left;
	text-align: left;
	left: 0px;
	width: 50px;
	vertical-align: top;
	border: 1px solid blue;
}

.st_item_content_float {
	position: relative;
	float: left;
	text-align: left;
	top: 0px;
	left: 0px;
	padding-top: 3px;
	border: 1px solid red;
}

.st_item_content {
	padding-top: 3px;
	padding-left: 6px;
	text-align: left;
	vertical-align: top;
}

.st_item_content_shield {
	padding-left: 10px;
	padding-top: 3px;
	vertical-align: top;
	font-size: 11px;
	color: #999;
	white-space: nowrap;
}

.st_item_content_shield .adminBadge {
	vertical-align: middle;
	padding-right: 5px;
}
/* *************************** */
/* Switch Teams Dropdown Menu */
/* *************************** */

/* ********************* */
/*  Status Messages      */
/* ********************* */
.sm_corner { background: url('../images/sMessageSprite.gif') #fff no-repeat; width: 7px; height: 7px; padding: 0; margin: 0; }
.sm_ul { background-position: 0px 0px; }
.sm_ur { background-position: -9px 0px; }
.sm_ll { background-position: 0px -9px; }
.sm_lr { background-position: -9px -9px; }
.sm_top { background: url('../images/sMessageBg_horiz.gif') 0px 0px repeat-x; padding: 0; }
.sm_bottom { background: url('../images/sMessageBg_horiz.gif') 0px -9px repeat-x; padding: 0; }
.sm_left { background: url('../images/sMessageBg_vert.gif') 0px 0px repeat-y; padding: 0;}
.sm_right { background: url('../images/sMessageBg_vert.gif') -9px 0px repeat-y; padding: 0; }
.sm_contentbox { background: #eee; padding: 1px 5px 1px 4px; vertical-align: middle; }
.sm_content {
	padding-left: 11px;
	font-family: tahoma, verdana, arial, geneva, sans-serif;
	font-weight: bold;
	font-size: 13px;
	line-height: 1.2em;
}
.sm_content_small {
	font-weight: normal;
	font-size: 11px;
	margin-top: 2px;
}
/* ********************* */
/*  /Status Messages     */
/* ********************* */


/* ********************* */
/* Req Field indicator   */
/* ********************* */
.reqField {
	font-size: 12px;
	font-weight: bold;
}

.reqFieldIcon {
	padding-left: 3px;
	padding-right: 6px;
	vertical-align: middle;
}
/* ********************* */
/* /Req Field indicator   */
/* ********************* */


/* *************** */
/* Event statuses  */
/* *************** */
/**** MAKE SURE ANY CHANGES HERE ARE THE SAME IN TC_Main_Cron.php BuildReminder() function! ****/
.eventStatus_active {
	color: #333;
}

.eventStatus_postponed {
	color: #0000cc;
}

.eventStatus_canceled {
	color: #cc0000;
}

.eventStatus_forfeited {
	color: #cc0000;
}

.eventStatus_rainedOut {
	color: #cc0000;
}
/* /Event statuses */

.eventInfoLineHeight {
	line-height: 22px;
}
/* *************** */
/* /Event statuses  */
/* *************** */


/* **************************************************************** */
/* Styles for jQuery checkbox plugin (graphical checkboxes/radios)  */
/* **************************************************************** */
.jqCheckbox_checkToggle { display: inline; line-height: 20px; cursor: pointer; }
	.jqCheckbox_checkToggle .mark { display: inline; }
	.jqCheckbox_checkToggle img { vertical-align: middle; width: 60px; height: 20px; }
	.jqCheckbox_checkToggle img { background: transparent url('../images/checkbox/bgCheckToggle.png') no-repeat; }
	.jqCheckbox_checkToggle img { background-position: 0px 0px; }
	.jqCheckbox_checkToggle-hover img { background-position: 0px -20px; }
	.jqCheckbox_checkToggle-checked img { background-position: 0px -40px; }
	.jqCheckbox_checkToggle-checked .jqCheckbox_checkToggle-hover img { background-position: 0px -60px; }
	.jqCheckbox_checkToggle-disabled img { background-position: 0px -80px; cursor: default; }
	.jqCheckbox_checkToggle-checked .jqCheckbox_checkToggle-disabled img { background-position: 0px -100px; cursor: default; }

.jqCheckbox_checkBox { display: inline; line-height: 20px; cursor: pointer; }
	.jqCheckbox_checkBox .mark { display: inline; }
	.jqCheckbox_checkBox img { vertical-align: middle; width: 20px; height: 20px; margin: 0px 5px 4px 3px; }
	.jqCheckbox_checkBox img { background: transparent url('../images/checkbox/bgCheckBoxes_v2.gif') no-repeat; }
	.jqCheckbox_checkBox img { background-position: 0px 0px; }
	.jqCheckbox_checkBox-hover img { background-position: 0px -20px; }
	.jqCheckbox_checkBox-checked img { background-position: 0px -40px; }
	.jqCheckbox_checkBox-checked .jqCheckbox_checkBox-hover img { background-position: 0px -60px; }
	.jqCheckbox_checkBox-disabled img { background-position: 0px -120px; cursor: default; }
	.jqCheckbox_checkBox-checked .jqCheckbox_checkBox-disabled img { background-position: 0px -100px; cursor: default; }

.jqCheckbox_checkBoxSmall { display: inline; line-height: 16px; cursor: pointer; }
	.jqCheckbox_checkBoxSmall .mark { display: inline; }
	.jqCheckbox_checkBoxSmall img { vertical-align: middle; width: 16px; height: 16px; margin: 0px 5px 4px 3px; }
	.jqCheckbox_checkBoxSmall img { background: transparent url('../images/checkbox/bgCheckBoxesSmall.gif') no-repeat; }
	.jqCheckbox_checkBoxSmall img { background-position: 0px 0px; }
	.jqCheckbox_checkBoxSmall-hover img { background-position: 0px -16px; }
	.jqCheckbox_checkBoxSmall-checked img { background-position: 0px -32px; }
	.jqCheckbox_checkBoxSmall-checked .jqCheckbox_checkBox-hover img { background-position: 0px -48px; }
	.jqCheckbox_checkBoxSmall-disabled img { background-position: 0px -64px; cursor: default; }
	.jqCheckbox_checkBoxSmall-checked .jqCheckbox_checkBoxSmall-disabled img { background-position: 0px -80px; cursor: default; }.jqCheckbox_radioBox { display: inline; line-height: 17px; cursor: pointer; }
	
.jqCheckbox_radioBox .mark { display: inline; }
	.jqCheckbox_radioBox img { vertical-align: middle; width: 17px; height: 17px; margin: 0px 8px 4px 3px; }
	.jqCheckbox_radioBox img { background: transparent url('../images/checkbox/bgRadioButtons.gif') no-repeat; }
	.jqCheckbox_radioBox img { background-position: 0px 0px; }
	.jqCheckbox_radioBox-hover img { background-position: 0px -20px; }
	.jqCheckbox_radioBox-checked img { background-position: 0px -40px; }
	.jqCheckbox_radioBox-checked .jqCheckbox_radioBox-hover img { background-position: 0px -60px; }
	.jqCheckbox_radioBox-disabled img { background-position: 0px -80px; cursor: default; }
	.jqCheckbox_radioBox-checked .jqCheckbox_radioBox-disabled img { background-position: 0px -100px; cursor: default; }
/* **************************************************************** */
/* /Styles for jQuery checkbox plugin (graphical checkboxes/radios) */
/* **************************************************************** */

/* ******************** */
/* PHP Calendar         */
/* ******************** */
.phpCal_table {
	background-color: #fff;
	width: 100%;
}

.phpCal_tableNav {
	padding: 10px 5px 5px 5px;
}

.phpCal_daysContainer {
	width: 100%;
	border: none;
	padding: 3px 5px 5px 5px;
}

.phpCal_monthName {
	font-family: tahoma, arial, verdana, geneva, sans-serif;
	font-size: 1.4em;
	font-weight: bold;
	line-height: 1.0em;
	color: #1B187F;
	margin-top: 0px;
	margin-bottom: 3px;
	text-align: left;
	padding: 2px 10px 0px 10px;
}

.phpCal_monthNavLink {
	font-size: 1em;
	margin: 0px 5px 0px 5px;
}

.phpCal_dayOfWeekLabel {
	padding: 5px;
	padding-bottom: 7px;
	font-size: 1.1em;
	font-weight: normal;
	text-align: center;
	background: url('../images/bg_gradientGray2.gif') #ddd repeat-x;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}

.phpCal_dayOfWeekLabelRight { border-right: 1px solid #ccc; }

.phpCal_dayNumberLabel {
	background-color: #fff;
	border-bottom: 1px solid #dfdfdf;
	border-bottom: 0;
	font-size: 1em;
	font-weight: bold;
	color: #666;
	text-align: left;
	padding-left: 5px;
	height: 18px;
	line-height: 18px;
}

.phpCal_dayNumberLabel_today {
	background: #ffffcc;
}

.phpCal_dayNumberLabel_startOfMonth {
	color: #666;
}

.phpCal_dayNumberLabel_outsideMonth {
	color: #333;
	font-weight: normal;
	background: none;
}

.phpCal_dayCell {
	border-top: 2px solid #ddd;
	border-left: 1px solid #e0e0e0;
	padding: 0px;
	padding-top: 0px;
	margin: 0px;
	/*height: 100px;  Adjust in conjunction w/phpCal_dayContentContainer */
	font-size: 1.1em;
	background: #fff;
}

.phpCal_dayCellMinHeight { height: 5em; }
.phpCal_dayCellRight { border-right: 1px solid #ddd; }
.phpCal_dayCellBottom { border-bottom: 1px solid #ddd; }
.phpCal_dayCellCurrent { background: #ffffcc; }
.phpCal_dayCellOutsideMonth { background-color: #f3f3f3; }

.phpCal_dayContentContainer {
	padding: 3px;
	/*height: 75px;  Adjust in conjunction w/phpCal_dayCell */
	overflow: auto;
}

.phpCal_dayItemContainer {
	color: #333;
	display: block;
	padding: 2px 4px 2px 6px;
	border: 1px solid #ccc;
	font-size: 0.9em;
	margin-top: 3px;
	text-decoration: none;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}

.phpCal_dayItemContainer_first {
	margin-top: 0px;
}

.phpCal_dayItemContainer:hover {
	color: #333;
	border: 1px solid #999;
	text-decoration: none;
	cursor: pointer;
}

.phpCal_dayItemTime {
	font-weight: bold;
}

.phpCal_dayItemOther {
	
}
/* ******************** */
/* /PHP Calendar        */
/* ******************** */

/* ******************** */
/* Color Picker         */
/* ******************** */
#colorPickerSidebar {
	float: left;
	margin-left: 10px;
	margin-top: 24px;
}

.colorPickerTabContentContainer {
	width: 370px;
	height: 310px;
	overflow: auto;
}
/* ******************** */
/* /Color Picker         */
/* ******************** */

/* ******************** */
/* Color Swatches       */
/* ******************** */
.colorSwatchContainer {
	margin: 0px 20px 20px 0px;
	cursor: default;
}

.colorSwatchContainerLast {
	margin-right: 0px;
}

.clickableSwatch {
	cursor: pointer;
}

.colorSwatchBorder {
	width: 41px;
	height: 41px;
	border: 1px solid #ccc;
}

.colorSwatchBorderSelected {
	width: 39px;
	height: 39px;
	border: 2px solid #666;
}

.colorSwatchBorderTiny {
	width: 22px;
	height: 22px;
}

.colorSwatchBorderSmall {
	width: 31px;
	height: 31px;
}

.colorSwatchBorderLarge {
	width: 66px;
	height: 66px;
}

.colorSwatch {
	width: 35px;
	height: 35px;
	margin: 2px;
	border: 1px solid #ccc;
	display: block;
	text-decoration: none;
}

.colorSwatchSelected {
	width: 33px;
	height: 33px;
}

.colorSwatchTiny {
	width: 18px;
	height: 18px;
	margin: 1px;
}

.colorSwatchSmall {
	width: 25px;
	height: 25px;
}

.colorSwatchLarge {
	width: 60px;
	height: 60px;
}

.colorSwatchLabel {
	font-size: 11px;
	text-align: center;
	width: 100px;
	margin-top: 5px;
}

#colorPreviewContainer {
	border: 1px solid #ddd;
	padding: 5px 10px 10px 10px;
	padding: 0px 0px 10px 0px;
	width: 170px;
	text-align: center;
}

.colorSwatchContainerLarge {
	margin-left: auto;
	margin-right: auto;
	cursor: default;
}

#colorPreviewColorList {
	margin-top: 5px;
	padding: 0px 10px 0px 10px;
}

div.farbtastic {
	margin-left: auto;
	margin-right: auto;
}

#colorPreviewSwatchLabelContainer {
	margin-top: 5px;
	text-align: center;
}

#colorPreviewSwatchLabel {
	border: 2px solid #ccc;
	padding: 2px;
	font-weight: bold;
	text-align: center;
	background-color: #ffffff;
}
/* ******************** */
/* Color Swatches       */
/* ******************** */


/* *************************** */
/* RSVP Rules (Team Options)   */
/* *************************** */
.rsvpRuleContainer {
	border: 1px solid #ccc;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	background-color: #fffffc;
	margin: 0 0 10px 0;
	padding: 8px;
	cursor: move;
}

/* Placeholder for dragging (reordering) RSVP rules */
.rsvpRuleContainer_placeholder {
	border: 1px solid #ccc;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	background-color: #fafafa;
	margin: 0 0 10px 0;
	padding: 8px;
	cursor: move;
	margin: 0 0 10px 0;
}
/* *************************** */
/* RSVP Rules (Team Options)   */
/* *************************** */

/* *************************** */
/* Date Box                    */
/* *************************** */
/*
HTML Structure (note that a "compact" class can be applied to the main datebox container to make the datebox more compact in appearance)

<div class="dateBox [compact]">
	<div class="header">
		<div class="dayName">Tuesday</div>
		<div class="monthName">February</div>
	</div>
	<div class="monthNumber">28</div>
	<div class="endDate">through Feb 29</div> <!-- endDate is only output if different from startDate -->
	<div class="year">2012</div>
	<div class="time">5:00pm</div>
</div>

The "time" container is designed to be optional.
*/
.dateBox {
	width: 90px;
	border: 4px solid #ccc;
	background: #fff;
	font-size: 12px;
	
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
	-webkit-box-shadow: 2px 2px 5px 0 rgba(200, 200, 200, .1);
	-moz-box-shadow: 2px 2px 5px 0 rgba(200, 200, 200, .1);
	box-shadow: 2px 2px 5px 0 rgba(200, 200, 200, .1);

}

.dateBox.compact {
	border: 3px solid #ccc;
}

.dateBox .header {
	background-color: #cfd7ff; /* Default, can be overridden when output as needed */
	
	padding: 3px 0 5px 0;
	border-bottom: 2px solid #ccc;
	
	border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
}

.dateBox.compact .header {
	padding: 2px 0 4px 0;
}

.dateBox .dayName {
	text-align: center;
	font-size: 0.9em;
	color: #333;
	font-weight: bold;
}

.dateBox .monthName {
	text-align: center;
	margin-top: 6px;
	font-size: 1.2em;
	color: #333;
	font-weight: bold;
	
	text-shadow: 1px 1px 2px rgba(100, 100, 100, 0.2); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.dateBox.compact .monthName {
	margin-top: 4px;
	font-size: 1.1em;
}

.dateBox .monthNumber {
	text-align: center;
	margin: 4px 0 0px 0;
	line-height: 1em;
	font-size: 3.5em;
	color: #333;
	font-weight: bold;
	font-family: arial, helvetica, sans-serif;
	
	text-shadow: 1px 1px 2px rgba(100, 100, 100, 0.15); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.dateBox.compact .monthNumber {
	margin: 3px 0 0px 0;
	font-size: 2.6em;
}

.dateBox .endDate {
	text-align: center;
	margin: 1px 0 6px 0;
	font-size: 0.9em;
	color: #333;
	font-weight: bold;
	
	text-shadow: 1px 1px 2px rgba(100, 100, 100, 0.2); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.dateBox .year {
	text-align: center;
	margin: 2px 0 6px 0;
	font-size: 0.9em;
	color: #333;
	font-weight: bold;
	font-size: 1.2em;
	
	text-shadow: 1px 1px 2px rgba(100, 100, 100, 0.2); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.dateBox.compact .year {
	font-size: 1.1em;
}

.dateBox .time {
	border-top: 2px solid #ccc;
	text-align: center;
	padding: 4px 6px 5px 6px;
	font-size: 1em;
	color: #333;
	font-weight: bold;
	background-color: #fafafa;
	
	border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 1.2); /* x-offset, y-offset, blur, rgba(R, G, B, opacity) */
}

.dateBox.compact .time {
	
}

/* *************************** */
/* Date Box                    */
/* *************************** */


/* *************************** */
/* Element Overlay             */
/* *************************** */
.overlay {
	position: absolute;
	top: -10px;
	left: -10px;
	min-height: 60px;
	background: url('../images/bg-trans-60.png') repeat;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	text-align: center;
	display: none;
	z-index: 10000; /* Set high to ensure it's on top of any other elements on the page */
}

.overlay-progress-container {
	display: inline-block;
	text-align: center;
	background: #fff;
	padding: 8px;
	/*width: 24px;*/
	margin: 20px auto 0 auto;
	margin-left: auto;
	margin-right: auto;
	border: 4px solid #222;
	
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
	-webkit-box-shadow: 0px 0px 15px 0 rgba(255, 255, 255, 0.4);
	-moz-box-shadow: 0px 0px 15px 0 rgba(255, 255, 255, 0.4);
	box-shadow: 0px 0px 15px 0 rgba(255, 255, 255, 0.4);
}

.overlay-progress-icon-spinner {
	width: 24px;
	height: 24px;
	margin-left: auto;
	margin-right: auto;
	border: 0;
	background: url('../images/ajax/spinner_24.gif') no-repeat;
}

.overlay-progress-icon-success {
	width: 24px;
	height: 24px;
	margin-left: auto;
	margin-right: auto;
	border: 0;
	background: url('../images/icons/tick_24.png') no-repeat;
}

.overlay-progress-icon-info {
	width: 16px;
	height: 16px;
	margin-left: auto;
	margin-right: auto;
	border: 0;
	background: url('../images/icons/info.gif') no-repeat;
}

.overlay-progress-icon-error {
	width: 24px;
	height: 24px;
	margin-left: auto;
	margin-right: auto;
	border: 0;
	background: url('../images/icons/warning_24.png') no-repeat;
}

/* Placeholder element is used if no icon is displayed. Note negative margin
   to couteract top margin of progress text. */
.overlay-progress-icon-none {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: -10px;
	border: 0;
}

.overlay-progress-text {
	margin: 8px 5px 0 5px;
	font-size: 1em;
	font-weight: bold;
	color: #444;
	white-space: nowrap;
}

/* *************************** */
/* /Overlay                     */
/* *************************** */