/*	File: SouthSide Football Club
	Author: Ife Okwumabua	*/

/*======[Global xHTML Elements]======*/
	* {
		margin: 0;
		padding: 0;
		font-family: "Trebuchet MS", Helvetica, Arial, San-Serif;
	}
	HTML {
		border: none;
		/*overflow: hidden;*/
		height: 100%;
	}
	BODY {
		position: relative;
		background: url(images/background/grass-tile.jpg);
		/*background: #9c9c9c url(images/background/body.jpg) center center no-repeat;
		padding-bottom: 15px;*/
		height: 98%;
		background-color: #efefef;
		color: #333;
		font-size: 10pt;
		text-align: center;
		padding-top: 1%;
	}
	A, BODY, B, CODE, DIV, H1, H2, H3, H4, H5, INPUT, LABEL, P, SELECT, SPAN, TABLE, TR, TH, TD, TEXTAREA, UL, OL, LI {}
	a {
		text-decoration: none;
		}
		a:hover {
			text-decoration: underline;
		}
		a img {	border: none; }
		a.button {
			margin: 0px;
			padding: 7px 0px 13px 11px;
			color: #f4f4f4;
			/*font-size: 1.5em;*/
			vertical-align: top;
			background: transparent url(images/anchor/default.gif) top left no-repeat;
			}
			a.button span {
				vertical-align: bottom;
				text-transform: uppercase;
				letter-spacing: 2px;
				font-size: 1.5em;
				padding: 8px 0px 7px;
				padding-right: 11px;
				background: transparent url(images/anchor/defaultRight.gif) top right no-repeat;
				color: #f4f4f4;
				font-weight: bold;
			}
			a.button:hover {
				background-image: url(images/anchor/hover.gif);
				}
				a.button:hover span {
					background-image: url(images/anchor/hoverRight.gif);
		}
		a.mapped {
			color: #fff;
			text-decoration: underline;
		}
		a.mapped:hover {
			color: #df002d;
		}
		a.nav {
			color: #fff;
		}
		a.expenseDetails {
			float: right;
			color: #fff;
			font-size: 10px;
			vertical-align: middle;
			margin-right: 5px;
	}
	h1, h2, p, table {
		clear: none;
		}
		h1 {
			font-size: 1.7em;
			}
			h1.title {
			}
			h1.programTitle {
				padding: 15px 0px;
				/* margin-bottom: 15px; */
				}
				h1.programTitle input.switchButton {
					margin-left: 20px;
		}
		h2 {
			font-size: 1.5em;
			}
			h2.subTitle {
				margin-top: 15px;
				margin-bottom: 5px;
		}
		h3 {
			font-size: 1.3em;
		}
		h4 {
			font-size: 1.1em;
	}
	hr {
		margin: 0px;
		padding: 0px;
	}
	img {}
		img.bordered {
			display: block;
			margin: 10px auto;
			border: 6px solid #fff;
		}
	p {
		margin-top: 8px;
		line-height: 1.5em;
	}
	select {
		padding: 0px;
		line-height: 100%;
	}
	textarea {
		background: #eee;
		border: 1px #ccc solid;
		margin: 0px;
		margin-top: 10px;
		margin-left: 10px;
		padding: 5px;
		overflow: hidden;
		width: 330px;
		vertical-align: top;
/*		visibility: hidden;*/
		}
		textarea.fullSize {
			margin: 0px auto;
			height: 375px;
			width: 95%;
		}
		textarea.halfSize {
			height: 375px;
			width: 48%;
	}
	ul {}
		ul li {}
		ul.list {
			list-style-position: inside;
			/*background: red;*/
			}
			ul.list li {
				/*background: green;*/
		}
		ul.none {
			list-style: none;
			}
			ul.none li {
	}

	input.text, input.password {
		margin: 0px;
		padding: 4px 8px;
		line-height: 1.2em;
		width: 288px;
		border: none;
		background: #fff url(images/tripleTap/input/text/default.png) top left no-repeat fixed;
		}
		html>body input.text, html>body input.password {
			background: #fff url(images/tripleTap/input/text/default.png) top left no-repeat;
		}
		input.text.small {
			width: 60px;
		}
		input.text.medium {
			width: 135px;
	}

	input.button {
		margin-left: 8px;
		padding: 0px;
		border: none;
		width: 58px;
		height: 38px;
		background: transparent url(images/tripleTap/input/alpha/alphaButton.gif) top left no-repeat;
		}
		input.switchButton {
			font-size: 10px;
			font-weight: normal;
			vertical-align: middle;
	}
	table {
		margin: 0 auto;
		width: 85%;
		background: url(images/background/modal2.png);
		}
		table caption {
			background: url(images/background/header.png);
		}
		table thead {
			font-size: 1.1em;
			background: url(images/background/header.png);
		}
		table tfoot {
			font-size: 0.9em;
			/*background: url(images/background/header.png);*/
			background-image: url(images/background/modal2.png);
		}
		table tr {
		}
		table tr th, table tr td {
			padding: 5px 0 5px 7px;
			}
			table tr th {
			}
			table tr td {
				padding-left: 14px;
			}
			table.standings {
				}
				table.standings tr td {
					font-size: 1.3em;
			}
			table.schedule {
				background: none;
				}
				table.schedule tr {
					background-image: url(images/background/modal2.png);
					}
					table.schedule tr td {
						/*background: url(images/background/modal2.png);
						/ *padding: 5px 0;*/
						padding-left: 15px;
						}
						table.schedule tr td.homeAway {
							/*width: 25px;*/
							padding: 2px 7px;
							text-align: center;
							font-size: 1.1em;
							font-weight: bold;
							color: #fff;
							vertical-align: middle;
							background-image: url(images/background/header.png);
						}
						table.schedule tr td.opponent {
							font-size: 1.2em;
							background-image: url(images/background/modal2.png);
	}
	.contentContainer {
		position: relative;
		margin: 0 auto;
		height: 98%;
		width: 90%;
		}
		.contentContainer .header {
			height: 6%;
			/*background: red;*/
		}
		.contentContainer .leftContent {
			padding-top: 10px;
			float: left;
			width: 170px;
			}
			.contentContainer .leftContent .siteLogo {
				}
				.contentContainer .leftContent .siteLogo h1.title {
			}
			/*.contentContainer .leftContent */ul.menuNav {
				margin: 20px 5px;
				list-style: none;
				}
				/*.contentContainer .leftContent */ul.menuNav li {
					margin: 0px;
					/*margin-bottom: 10px;*/
					padding: 4px;
					}
					/*.contentContainer .leftContent */ul.menuNav li a {
						display: block;
						padding: 4px;
						color: #fff;
						background: transparent url(images/background/header.png);
						opacity: 75%;
						font-weight: bold;
						}
						/*.contentContainer .leftContent*/ ul.menuNav li a:hover {
							color: #df002d;
							/*background: #d8d8d8;* /
							background-image: url(images/background/modal2.png);*/
			}
			.contentContainer .leftContent ul.subMenu {
				margin-top: 0px;
				margin-left: 0px;
				padding: 0px;
				background: grey;
				list-style: none;
				}
				.contentContainer .leftContent ul.subMenu li {
					font-size: 0.8em;
					background: yellow;
			}
			.contentContainer .leftContent .userBlock {
				position: absolute;
				left: 6px;
				bottom: 0px;
		}
		.contentContainer .mainContent {
			position: relative;
			margin-left: 180px;
			height: 99%;
			text-align: left;
/*			background-color: #fcfcfc;* /
			background: url(images/background/header.png);*/
			background: url(images/background/modal.png);
			border: 1px outset;
			color: #fff;
			}
			.contentContainer .mainContent h1.breadCrumb {
				margin-left: -10px;
				padding: 0px 0px 10px;
				font-size: 2em;
				text-align: left;
				font-weight: bold;
			}
			.contentContainer .mainContent .section {
				padding: 15px 10px 0px 20px;
				text-align: left;
				height: 97%;
				overflow: auto;
				position: relative;
				background-image: url(images/background/modal2.png);
			}
			.ie6 .contentContainer .mainContent .section {
				height: 98%;
	}

	.legend {
		margin: 0px;
		padding: 8px;
		text-align: center;
		background-image: url(images/background/modal2.png);
		/*#d8d8d8;
		color: #333;
		width: 50%;*/
		}
		.legend .date {
			vertical-align: middle;
			height: 15px;
			width: 15px;
	}

/* <Columns> */
	div.columns, .columns {
		padding-left: 10px;
		/*min-height: 200px;
		background: red;*/
		}
		div.columns div.column, .columns li {
			float: left;
		}
		div.two.columns {
			padding-left: 0px;
			}
			div.two.columns div.column {
				margin-right: 3%;
				width: 46%;
				padding-left: 0px;
		}
		div.three.columns {
			padding-left: 0px;
			}
			div.three.columns .column {
				float: left;
				margin: 0px;
				margin-right: 2.9%;
				/*padding-left: 10px;
				color: #fff;*/
				width: 30%;
				}
				div.three.columns .column.control {
					margin-right: 0px;
			}
			div.three.columns ul.services {
				float: left;
				margin: 0px;
				margin-right: 2.9%;
				padding-left: 10px;
				width: 30%;
				
				}
				div.three.columns ul.services li {
					padding: 0px;
				}
				div.three.columns ul.services.control {
					margin-right: 0px;
		}
		div.four.columns {
			padding-left: 0px;
			}
			div.four.columns .column {
				float: left;
				margin: 0px;
				margin-right: 1%;
				padding-left: 10px;
				width: 22%;
				/*background-color: orange;*/
				}
				div.four.columns .column.control {
					margin-right: 0px;
		}
		div.six.columns, ul.six.columns {
			padding-left: 0px;
			}
			div.six.columns div.column, .six.columns li {
				margin-right: 3%;
				width: 13%;
				padding-left: 0px;
	}
/* </Columns> */
	.splashBanner {
		margin: 2.5% 5% 0;
		overflow: auto;
		color: #fff;
		}
		.splashBanner img {
			float: left;
		}
		.splashBanner h1 {
			font-size: 2.5em;
		}
		.splashBanner h2 {
		}
		.splashBanner div {
			padding-top: 190px;
			font-size: 1.2em;
		}
		.splashBanner div a {
			color: #000;
	}


	.infoGroup {
		margin: 0px;
		/*margin-bottom: 25px;*/
		padding: 0px 0px 10px 15px;
		}
		.infoGroup .inputRow {
			height: 26px;
			padding-top: 5px;
			padding-bottom: 5px;
			font-size: 1.3em;
			/*text-align: right;
			background: orange;*/
			}
			.infoGroup .inputRow code {
				margin-left: 5px;
				color: red;
				vertical-align: top;
			}
			.infoGroup .inputRow label {
			}
			.infoGroup .inputRow select {
				border: none;
				height: 30px;
				width: 160px;
				vertical-align: middle;
				font-size: 1em;
			}
			.infoGroup .inputRow input.text.small, .infoGroup .inputRow input.text.medium, .infoGroup .inputRow select {
				margin-left: 15px;
	}
	form.browse {
		}
		form.browse input.text, form.browse select {
			background: transparent;
			color: #fff;
		}
		form.browse .buttonRow {
			display: none;
	}

	.expenseTotalAmount {
		color: #2f7a36;
		font-size: 1.4em;
	}

	.totalAmount {
		font-size: 2em;
		}
		.work .totalAmount {
			color: #2f7a36;
		}
		.unrealized .totalAmount {
			color: #d12b2b;
		}
		.confirmed .totalAmount {
			color: #eae673;
	}
	.active.month {
		padding: 0px 6px;
		text-decoration: none;
	}
	.contactUs {
		color: #fff;
		background-image: url(images/background/modal.png);
		}
		.contactUs h3 {
			padding: 5px;
			background-image: url(images/background/modal2.png);
	}
	
	.gameResult {
		margin: 0px auto;
		padding: 10px;
		width: 60%;
		text-align: center;
		background-image: url(images/background/modal2.png);
		}
		.gameResult h4 {
			margin-bottom: 5px;
			padding: 8px;
			background-image: url(images/background/modal2.png);
		}
		.gameResult a {
			font-weight: bold;
			color: #ff0000;
		}
		.gameResult .homeTeam, .gameResult .awayTeam {
			font-size: 1.3em;
			float: left;
			width: 42%;
		}
		.gameResult .homeTeam img, .gameResult .awayTeam img {
			vertical-align: middle;
			width: 50px;
			height: 50px;
			}
			.gameResult .homeTeam img {
				margin-right: 10px;
			}
			.gameResult .awayTeam img {
				margin-left: 10px;
		}
		.gameResult .versus {
			margin: 15px 15px 0;
			font-size: 1.4em;
			vertical-align: bottom;
			float: left;
		}
		.gameResult .status {
			clear: left;
		}
		.gameResult .homeScore, .gameResult .awayScore {
			font-size: 2.2em;
			vertical-align: middle;
		}
		.gameResult .gameTime {
			margin: 0 30px;
			vertical-align: middle;
	}
	.mapContainer {
		margin: 0 auto;
		width: 85%;
		height: 200px;
		background-image: url(images/background/modal.png);
		color: #000;
		text-align: center;
		display: none;
	}
	.staffBio {
		margin-bottom: 40px;
		}
		.staffBio .staffPicture {
		}
		.staffBio ul.bullets {
			margin-left: 20px;
		}
		.staffBio .staffName {
			font-size: 1.7em;
			border-bottom: 1px solid #ffcc07;
		}
		.staffBio .staffTitle {
			font-size: 0.8em;
			text-transform: italic;
		}
		.staffBio .staffPersonal {
			margin-top: 15px;
			margin-right: 15px;
			padding: 5px;
			width: 200px;
			text-align: center;
			background: #7b43a2;
			float: right;
			
		}
		.staffBio .staffPicture {
			margin-bottom: 5px;
			height: 80px;
			width: 80px;
			/*float: left;*/
		}
		.staffBio .personalQuote {
			display: block;
			font-size: 0.9em;
			padding: 8px;
			font-style: italic;
			font-weight: bold;
	}

	
/* Helper Classes */
	.smallText {	font-size: 60%;		}
	.largerText {	font-size: 120%;	}
	.spacer {	padding: 0px 10px;	}
	.squeeze  {
		margin-left: 15px;
		margin-right: 15px;
	}
	.threeQuarterHeight {	height: 550px;	}
	.halfHeight {		height: 400px;	}
	.quarterHeight {	height: 200px;	}
	.sixthHeight {		height: 150px;	}
	.eighthHeight {		height: 100px;	}
	.leftIndent	{	padding-left: 15px;	}
	.rightIndent	{	padding-right: 15px;	}
	.pushDown {	margin-top: 5px;	}
	.pushRight {	margin-left: 10px;	}
	.pushLeft, form div.two.columns .column input.text.pushLeft {	margin-right: 10px;	}
	.pushLeft2 {	margin-right: 20px;	}

	.padTop, form div.two.columns .column .input.padTop {	padding-top: 5px;	}
		.padTop2 {	padding-top: 10px;	}
	.padRight {	padding-right: 10px;	}
	.padBottom {	padding-bottom: 10px;	}
	.padLeft {	padding-left: 10px;	}
	
	.scrollable {	overflow: auto;		}
		#caseBriefArea .scrollable {	
			padding-top: 10px;
			background-image: url(images/background/modal.png);
		}

	.greyBG {	background-color: #f9f9f9;	}
	.pinkBG {	background-color: #ed3d84;		}
	.blackBG {	background-color: #fff;	}
	.whiteBG {	background-color: #fff;	}
	.blueBG  {	background-color: #0099FF;	}
	.greenBG {	background-color: #43a832;	}
	.orangeBG {	background-color: #ffcc07;	}
	.purpleBG {	background-color: #7b43a2;	}
	
	.phoneNumber, .pinkText {	color: #ed3d84;	}
	.blackText 		{	color: #000;	}
	.whiteText 		{	color: #fff;	}
	.blueText 		{	color: #0099FF;	}
	.greenText		{	color: #43a832;	}
	.orangeText		{	color: #ffcc07;	}
	.redText		{	color: #df002d;	}
	.purpleText		{	color: #7b43a2;	}
	.hideMe {	display: none;	}

	.indentText {	text-indent: 20pt;	}

	.floatLeft  {	float: left;	}
	.floatRight {	float: right;	}
	
	.alignLeft, form div.two.columns .column.alignLeft {	text-align: left;	}
	.alignCenter {	text-align: center;	}
	.alignRight {	text-align: right;	}
	
	.clearLeft  {	clear: left;	}
	.clearBoth  {	clear: both;	}
	.clearRight {	clear: right;	}