/* 
========================================================================================================================================= 

Team Sports America Screen Styles

version:		1.0
date:			11-16-08
author:			Gregory Love
email:			togreglove@gmail.com
website:		ogrecave.org

========================================================================================================================================= 

Styles and Dimensions Reference

overall page dimensions 	970px x 728px
header 						970px x 158px 
main-body 					970px x 570px
small oval buttons			87px x 20px
TSA Blue					#003D78

========================================================================================================================================= 
*/

/* Resets ================================================================================================================================ */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, 
legend, caption { margin: 0; padding: 0; border: 0; outline: 0; }
html { font-size: 16px; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; }
h1 { font-size: 2.2em; } 
h2 { font-size: 2.0em; }  
h3 { font-size: 1.8em; } 
h4 { font-size: 1.6em; } 
h5 { font-size: 1.4em; } 
p  { font-size: 1.2em; }
table { border-spacing: 0; border-collapse: collapse; }
td    { text-align: left; font-weight: normal; }
input, select, th, td { font-size: 1em; }
/* ======================================================================================================================================= */

/* Global Settings =======================================================================================================================*/
a:link, a:visited, a:hover, a:active, a:focus { text-decoration: none; border: 0; outline: 0; margin: 0; }
fieldset { border: 1px solid black; text-align: left; padding: 5px; margin: 20px;}
.alert { border: 2px solid red; background: lightpink; padding: 2px 10px; font-size: 12px; font-weight: bold; }
.loader { border: 0; height: 0 ; width: 0; padding: 0; position: absolute;  visibility: hidden;  }
.info { border: 2px solid darkgray; background: lightgrey; padding: 2px 10px;
		font-size: 12px; font-weight: bold; color: #555555; }
.success { border: 2px solid darkgreen; background: palegreen; padding: 2px 10px; font-size: 12px;
    font-weight: bold; }


/* ====================================================================================================================================== */

/* Framing  ============================================================================================================================= */
body {	
	font: 62.5%/1.5 Arial, Helvetica, sans-serif; color: black; text-align: center;
	background: url('../images/site_images/bodybackground.jpg') center top repeat-y #e9d7b1;
}
#wrapper {
	position: relative; width: 970px; height: 728px; margin: 0 auto; 
    text-align: left;
	background: url('../images/site_images/wall_texture.jpg') top center no-repeat #E9D7B1;
}
/* End Framing  ========================================================================================================================= */

/* Begin Header ========================================================================================================================= */
#header   { position: relative; width: 970px; height: 158px;}

	/* Main Menu =============================================*/
	#main-menu { position: absolute; top:0px ; right: 30px; width: 400px; height: 20px;	font-size: 1.2em; color: #003D78; }
	#main-menu ul { float: right; }
	#main-menu li { display: inline; }
	#main-menu a  { color: #003D78; }
	/* End Main Menu =========================================*/
	
	/* Login Form ============================================*/
	#login-form { position: absolute; top: 20px; right: 30px; width: 420px; text-align: right; /* outline: 1px solid blue; */ }
	#get-email {
		background: url('../images/site_images/white-oval-sm-wide.png') no-repeat transparent; 
		padding: 3px 17px 3px 12px;
		width: 95px;
		border: 0;
		margin: 0;
		color: #003D78;
		/* outline: 1px solid green; */
	}
	#get-password {
		background: url('../images/site_images/white-oval-flat.png') no-repeat transparent; 
		padding: 3px 15px 3px 12px;
		width: 65px;
		border: 0;
		margin: 0;
		color: #003D78;
		/* outline: 1px solid green; */
	}
	#login label { 
		font-size: 1.2em; 
		color: #003D78; 
		/* outline: 1px solid pink; */
	}
	#login-submit {
		position: relative;
		border: 0; margin: 0; 
		padding: 1px 0px 3px 0px;
		width: 90px;
		text-align: center;
		color: #003D78;
		background: url('../images/site_images/white-oval-sm.png') no-repeat;
	}
	#login-submit:hover {
		padding: 2px 0 2px 2px;
		background: url('../images/site_images/white-oval-sm-emb.png') no-repeat;
	}

		/* End Login Form =============================================*/
		
		/* Logout Form ================================================*/
		#logout-greeting { 
			display: block;
			float: right;
			padding-right: 5px; font-size: 1.2em; color: #003D78; /* outline: 1px solid white; */ }
		#logout-button {
			float: right;
			text-align: center;
			padding-top: 1px;
			background: url('../images/site_images/white-oval-sm.png') 0px 0px no-repeat;
			font-size: 1.0em;
			color: #003D78;
			height: 19px; 
			width: 89px;
			cursor: pointer;
			/* outline: 1px solid pink; */
		}
		#logout-button:hover { 
			width: 87px; 
			padding-top: 3px; 
			padding-left: 2px; 
			background: url('../images/site_images/white-oval-sm-emb.png') 0px 0px no-repeat; 
		} 
	/* End Logout Form =============================================*/

	#logo-stripe {
		position: absolute;
		top: 44px;
		left: 0px;
		width: 970px;
		height: 70px;
		background: url('../images/site_images/gradientbar.png') no-repeat;
	}
	#site-name {
		position: absolute;
		left: 44px; top: 2px;
		width: 460px;
		height: 70px;
		text-indent: -9999px; overflow: hidden;
	}
	#logo-stripe p { text-indent: -9999px; overflow: hidden; }
	#league-logos { 
		position: absolute; 
		right: 22px;
		bottom: -5px;
	}
	
	/* Search Box */
	#search-box {
		position: absolute;
		top: 120px;
		left: 35px;
		width: 195px;
		height: 30px;
		line-height: 30px;
		font-size: 1.4em;
		text-align: left;
		color: #003D78;
		
	}
	#search-box label { vertical-align: middle;}
	#search-box input.text { 
		width: 130px; 
		height: 22px;
		background: url('../images/site_images/white-oval.png') no-repeat; border: 0;
		font-size: .8em;
		padding: 7px 0 0 11px;
		vertical-align: middle;
		color: #003D78;
	}
	#search-box .submit { display:none; }
	#search-icon {
		position: absolute;
		top: 10px;
		right: 0;
	}
	/* End Search Box */
/* End Header */

/* ====================================================================================================================================== */
#gradient_top {
	position: relative; width: 950px; height: 15px; margin: 0 auto;
	background: url('../images/site_images/gradient2_top.png') center top no-repeat;
}
#mainbody { 
	position: relative; width: 950px; height: 555px; margin: 0 auto;
	background: url('../images/site_images/gradient2_repeat.png') center top repeat-y;
	/* outline: 5px solid pink; */
}
#content-wrap { margin-top: -15px; float: left;}
body.homepage #mainbody { background-image: none; }
body.homepage #gradient_top { display: none; }
body.homepage #content-wrap { margin-top: 0; float: none;}

/* Homepage ================================================================== */

#lockers {  margin: 0 auto; width: 900px; height: 557px;
            background: url('../images/site_images/lockers.jpg') no-repeat; 
            overflow: hidden; }
.menu-locker { position: relative; float: left; width: 180px; height: 557px; /* outline: 1px solid green; */ }	
a.door, #teams-locker a {  /* Main Clickable Area to get to Category Page */ 
	position: absolute;
	left: 12px;
	display: block;
	width: 150px;
	height: 534px;
	text-indent: -2000px;
	overflow: hidden;
	/* outline: 1px solid green; */
}
li.menu-locker:hover { width: 325px; margin-right: -145px; z-index: 500;}
#teams-locker:hover { width: 180px; } 
.menu-locker:hover .door     { width: 335px; height: 535px; }
#garden-locker:hover .door   { background: url('../images/site_images/peek_garden.jpg') 0px 19px no-repeat; }
#patio-locker:hover .door    { background: url('../images/site_images/peek_patio.jpg') 0px 19px no-repeat; }
#pool-locker:hover .door     { background: url('../images/site_images/peek_pool.jpg') 0px 19px no-repeat;}
#homegift-locker:hover .door { background: url('../images/site_images/peek_homegift.jpg') 0px 19px no-repeat;}
#teams-locker:hover a        { background: url('../images/site_images/peek_teams.gif') 0px 8px no-repeat;} 

.locker-header { position: absolute; width: 150px; top: -2000px; left: 175px; color: white; font-size: 1.6em; text-align:center; }
li:hover .locker-header { top: 27px; }
.locker-list { position: absolute; width: 150px; text-align: center; font-size: 1.2em; top: -2000px;  left: 175px;}
li:hover .locker-list  { top: 100px;}
.locker-list li	{ line-height: 1.4; }
.locker-list li a	{ color: white; }
.locker-list li a:hover	{ color: lightgrey; }

/* End Homepage =============================================================== */

/* Interior Quicklinks ======================================================== */
	#category-quicklinks { position: absolute; bottom: 8px;	left: 260px; width: 500px; height: 20px; }
	#category-quicklinks li { float: left; width: 87px;	height: 20px; margin-right: 13px; padding-top: 1px;
		text-align: center; 
		cursor: pointer;
		background: url('../images/site_images/white-oval-sm.png') no-repeat;		
	}
	#category-quicklinks a { 
	    color: #003D78;
		display: block;
	}
	#category-quicklinks li.active, 
	#category-quicklinks li:hover { padding: 2px 0 0 2px; margin-right: 11px;
		background: url('../images/site_images/white-oval-sm-emb.png') no-repeat  
	}

/* PAGES WITH TWO PANE MENUS ================================================== */
	 
/* Left-Hand Side of Menu Pages, must be 150px wide =========================== */
	#left-nav { width: 150px; height: 570px; float: left; padding: 0; 
	    text-align: center; color: #003D78;   
	 }
	.menu-header { font-size: 1.3em; margin: 10px 0; padding: 0; text-transform: uppercase; font-weight: bold; }
	.menu-list li { font-size: 1.1em; margin-bottom: 2px; }
	.menu-list li.active a, .menu-list li:hover a { font-weight: bold; color: black;}
	.menu-list a { color: #003D78; }
	
	#league-nav { margin-top: 20px; }
	#league-nav li {  line-height: 1.2; margin: 15px 0;}
	#league-nav a { font-size: 1.7em; color: #003D78; }
	#league-nav a:hover,
	#league-nav a.active { font-weight: bold; }
 
/* Right-Hand Side ============================================================ */
	.category-group-image { float: left; width: 790px; height: 560px; padding: 0; }
	#cat1 { background: url('../images/site_images/group_garden.gif') -20px 10px  no-repeat; }
	#cat2 { background: url('../images/site_images/group_patio.gif') -20px 10px  no-repeat; }
	#cat3 { background: url('../images/site_images/group_pool.gif') -20px 10px  no-repeat; }	
	#cat4 { background: url('../images/site_images/group_homegift.gif') -20px 10px  no-repeat; }
	 
	#items { position: relative; float: left; width: 780px; height: 550px; margin: 0 0 10px 0; padding: 10px; 
	    overflow: auto; 
	}
	#items .nav { display: block; /*position: fixed;*/ }
	#items .nav a { 
		display: block;
		float: left;
		background: url("../images/site_images/white-oval-sm.png");
		width: 90px;
		color: #003D78;
		font-size: 10px;
		text-align: center;
		padding-top: 2px;
		padding-bottom: 2px;
		}
	#items .nav a:hover,
	#items .nav a.active {
		background: url("../images/site_images/white-oval-sm-emb.png");
	}
	#page-header { text-align: right; color: white; }
	#product-description { color: white; width: 90%; float: right; text-align: right; }
	#product-header { clear: right; color: white; padding-left: 10px;}
	#product-list {	text-align: center;	font-size: 1.2em; }
	#product-list li { float: left;	width: 160px; height: 180px; margin: 15px;	text-align: center;	}
	#product-list a.pic { display:block; float:left; height:160px; width:160px;	}
	#product-list a.txt { color: white;	text-transform: uppercase; font-size: .8em;}
	
	/* Teams Page */
	#teams { float: left; width: 784px; height: 540px; margin: 0; padding: 8px 8px 22px 8px; overflow: auto; }
	#sport-title { clear: right; color: white; padding-left: 10px;}
	#team-list li,
	#team-list img { width: 189px; height: 45px; margin: 1px; float: left; }
/* End Right Hand Menus */

/* Registration Form ===================================================================================*/
		
		#joinbox { width: 950px; height: 570px; background: url('../images/site_images/gradient2.png'); font-size: 1.2em;}
		#joinbox fieldset { background: url('../images/site_images/wall_texture.jpg'); border: 1px solid black; position: absolute;}
		#joinbox fieldset.jb1 { top: 0px;  left: 0px; width: 898px; height: 120px; }
		#joinbox fieldset.jb2 { top: 138px; left: 0px; width: 440px; height: 295px; float: left; }
		#joinbox fieldset.jb3 { top: 138px; right: 0px; width: 440px; height: 295px; float: left; }
		#joinbox fieldset.submit { bottom: 0px; left: 0px; width: 898px; height: 67px; }
		#joinbox input { margin: 0; font-size: .8em; padding-left: 4px;}
		#joinbox fieldset.jb1 label { float: left; width: 50%; margin-right: 1em; text-align: right; }
		#joinbox fieldset.jb2 label,#joinbox fieldset.jb3 label { float: left; width: 30%; margin-right: 1em; text-align: right; }
		#joinbox fieldset li { float: left; width: 100%; clear: both; padding-bottom: 3px;}
		#joinbox fieldset.submit p { clear: left; }
		#joinbox fieldset.submit { text-align: center; padding: 5px; font-size: .8em;  }
		#joinbox .required { font-weight: bold; color: red; }
		#joinbox .headline { 
			display: block; 
			width: 100%; 
			height: 20px; 
			background: url('../images/site_images/gradient2.png') center; 
			text-align: center; 
			line-height: 20px; 
			font-weight: bold; 
			margin-bottom: 5px;
			color: white;
			border: 1px solid white;
		} 
		#joinbox fieldset.submit input {
			height: 19px;
			width: 87px;
			border: 0; /* Undecorate it */
			font-size: 1.2em;
			color: #003D78;
			background: url('../images/site_images/white-oval-sm.png') no-repeat;
			margin: 5px;
		}
		#RegistrationReply {
	padding: 20px;
	font-size: 18px;
	font-weight: bold;
}

		
/* End Register Form ====================================================================================== */


/* Management  ============================================================================================*/

#adminStartButton { 
	position: absolute; width: 87px; height: 20px; right: 22px;	top: 60px; padding-top: 1px;
	cursor: pointer; text-align: center; color: #003D78;
	background: url('../images/site_images/white-oval-sm.png') no-repeat; 
}
#adminStartButton.active, #adminStartButton:hover { 
	padding: 3px 0 0 2px;
	background: url('../images/site_images/white-oval-sm-emb.png') no-repeat; }
#adminButtons {
	position: absolute; display: none; top: 61px; left: 140px; width: 695px; height: 20px;
}
#adminButtons.active { display: inline; }
#adminButtons li{	  
	display: block;	float: left; margin-right: 10px; width: 89px; height: 19px; padding-top: 1px; 
	cursor: pointer; text-align: center; color: #003D78; 
	background: url('../images/site_images/white-oval-sm.png') no-repeat; 
}
#adminButtons li:hover, #adminButtons li.active {
    padding-top: 3px; padding-left: 2px; margin-right: 8px;
	background: url('../images/site_images/white-oval-sm-emb.png') no-repeat;		
}	
#adminWindow {
	position: absolute;	display: none; padding: 5px; height: 550px; border: 3px ridge #888888;
    background: url('../images/site_images/wall_texture.jpg') center;
}
#adminTitleBar {
	position: absolute;	top: 0px; left: 0px; width: 100px; height: 20px; border: 0; padding-left: 20px;
    line-height: 20px; color: white; font-size: 1.4em; font-weight: bold; text-align: left;
	background: url('../images/site_images/gradient2.png') right center;        
}
#adminContent {
	position: absolute;	top: 25px; left: 5px; right: 5px; bottom: 5px; padding: 15px;
	overflow: auto;		
}
#addbutton {
	position: absolute; top: 5px; right: 5px; width: 89px; height: 19px;
	color: #003D78;	text-align: center;	cursor: pointer;
	background: url('../images/site_images/white-oval-sm.png');
}
/* ============================================================================================================ */

.edit-icon { position: absolute; right: 25px; top: 5px; height: 20px; width: 20px; }
#edit-panel { position: absolute; left: 150px; top: 0px; width: 700px; height: 30px; }
.article-wrapper { padding: 25px; height: 90%;}




/* Search Formatting */
#SearchResults {
	overflow: auto; 
	height: 530px; 	
	padding: 20px;
}
#SearchResults th {
	padding: 10px;
	font-size: 14px;
	font-weight: bold;
}

/* Administration Pop-Up Windows ================================================================== */
.admin-table { table-layout: fixed; border: 1px solid black; }
.admin-table th { font-size: 14px; background: LemonChiffon; text-align: center; border: 1px solid black;}
.admin-table td { font-size: 12px; background: snow; text-align: center; border: 1px solid black; }
.admin-table div.canvas {
	position: relative; padding: 10px;
	background: PapayaWhip; 
}		
.save-button { 
	position: absolute; top: 5px; right: 5px; width: 90px; height: 20px;
	background: url("../images/site_images/oval-green-up.png") no-repeat; 
	text-align: center; cursor: pointer;}
.save-button:hover { 
	background: url("../images/site_images/oval-green-down.png") no-repeat; }
.delete-button { 
	position: absolute; top: 30px; right: 5px; width: 90px; height: 20px; 
	background: url("../images/site_images/oval-red-up.png") no-repeat;
	text-align: center; cursor: pointer; }
.delete-button:hover { 
	background: url("../images/site_images/oval-red-down.png") no-repeat; }
#status {
	position: absolute; top: 0px; left: 200px; width: 500px; height: 20px;
	font-weight: bold; font-size: 18px; text-align: center; }
table.admin-table td.minor-error {
	background-color: LightPink;}
div.canvas { text-align: left; }
div.canvas label {
	display: inline-block; width: 300px; margin-right: 20px;
	text-align: right;	
}
div.canvas input[type='text'], 
div.canvas textarea { width: 400px; }

/* Promotions Page */
#promotions { overflow: auto; }

	


/* Details Pane =========================================================================================== */

#detailInsert {	position: absolute;	left: 250px; top: 100px; height: 490px;	width: 485px; display: none;	margin: 0; padding: 0;
/* outline: 1px solid pink; */ }
#productDetail { position: absolute; width: 485px; height: 490px;	color: #003D78; /* outline: 1px solid black; */ }
#productBackground { }
#productTitle {  position: absolute; top: 15px; left: 18px; width: 350px; height: 25px; font-size: 16px; font-weight: bold; overflow: hidden; }
#productPhoto { position: absolute; top: 50px;	left: 20px;	width: 300px;	height: 300px; /* outline: 1px solid red; */ }
#productClose{	display: block; position: absolute;	top: 10px;	right: 10px;	width: 105px;	height: 17px;	text-indent: -9999px;	overflow: hidden;	
background-image: url('http://www.microsoft.com/ie7fix.gif'); /* outline: 1px solid green; */ }
#productPrint { display: block; position: absolute;	top: 32px;	right: 10px;	width: 60px;	height: 17px;	text-indent: -9999px;	overflow: hidden;
background-image: url('http://www.microsoft.com/ie7fix.gif');	/*  outline: 1px solid green; */}
#productDescription {	 position: absolute;	top: 70px;	left: 330px;	width: 150px;	height: 200px;	/* outline: 1px solid teal; */ }
#productSummary {	 position: absolute;	top: 360px;	left: 20px;	width: 450px;	height: 60px;	/* outline: 1px solid blue; */}
#productDescription {	font-size: 12px;		text-align: left;	overflow: hidden;}
#productSummary {	font-size: 20px; text-align: center;	font-weight: bold;}

#preloader { display:none; visibility: hidden; position: absolute; left: -3000px; }