/*-----------------------------------------------------------

	Bayview Village Tennis Club - Screen Styles
	Author: sergiu.ecob@starteam.ca 

------------------------------------------------------------*/

* { /* remove all the padding and margins from every page element */
	margin: 0;
	padding: 0;
}

/* Control's div's where the id = 'body' */
body {
	font-size: x-small; /* for all browsers except IE */
	font-family:  Arial, Verdana, Helvetica, sans-serif;
	background-color: #99CC66; /* Light Green #99CC66 #99cc99*/
	/*text-align: center;  /* center the page in IE5/Win */
	/*margin: 2em; /*  */
}

/* All <p></p> tags will have a 10px box around the enclosed text */
p {
	padding:10px;
}

/* ----------------- Links */
a { /* all links */
	font-weight: bold;
}
a:hover { /* Control what happens when the user hovers over a link */
	text-decoration: underline;
}
/* ----------------- End Links */

/*-----------------------------------------------------------
	Page Layout
------------------------------------------------------------*/
div { /* controls all the divs in the html files*/
	/*border: 1px solid Black;*/
}

/* the main window which surrounds the whole page */
#pageFrame { /* fixed page width and centering within the browser window */
	width: 1000px;
	/*margin: 0 auto; /* Centers the page in the internet browser window */
	text-align: left; /* counteract the IE5/Win page center above  */
	border: 1px solid white;
	
	/* background column to make it look like the sidebar goes all the way down */
	background: url(../images/column_bg-subpage.gif) repeat-y top left; 
}

/* Controls all header styles */
#header {
	background:url(../images/banner_final.jpg);
	height:100px;
	border-bottom: 1px solid white;
	overflow: hidden; /* Dont show the spilling link */
}

/* Controls Hand Over The Top Banner */
#header a {
	display: block;
	padding-top:100px;
}

/* Any text wrapped in these <h1></h1> - <h6></h6> will have these styles */
h1, h2, h3, h4, h5, h6 {
	text-align: center; /* Where should the text be aligned */
}

/* Section header styling for content headers */
.sectionheader {
	background-color:#99CC66;
	text-align: left;
	padding: 2px;
}

/* Controls the content div */
#content {
	float: right; /* Aligns the div to the right of the sidebar */
	background-color:#FFFFFF;
	width: 847px; /* 778px sets the width of the content <div>*/
}

#content h1 {
	font-size: 225%;
}

#content h2 {
	font-size: 150%;
}

#content h3 {
	font-size: 150%;
}

/* controls any text wrapped in a <p></p> in the content div */
#content p {
	font-size:125%;
	padding:5px; /* 5 px of padding around all text */
}

/* any tables inside the content div will be controled from here */
#content table {
	font-size:120%;
}

/* any list items in the oontent div are controled here */
#content li {
	font-size:120%;
	margin-left:20px; /* Adjusts only the left margin of <li> elements in the content <div> */
	list-style-type:disc; /* what the bullets look like */
	list-style-position:inside; /* the bullets are placed inside the margin */
}

/* general form styles */
#genForm {
	padding: 5px;
	font-weight:bold;
}

/* The sidebar which runs along the left side of the web page */
#sidebar {
font-size:120%;
width: 151px;
float:left; /* aligns to the left of the content bar */
}

/* a small div which tells the user where he is on the website */
#location {
font-size:110%;
font-weight:bold;
text-align:center;
color: #006600; /* The font colour */
}

/* the footer bar at the bottom of the page */
#footer {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #99CC66;
	padding: 10px 15px 10px 20px; /* padding order, top right bottom left */
	border-top:1px solid white;
	clear:both; /* we want it to clear both content and sidebar divs */
	height:16px; /* sets the height of the <div> */
}

/* The first content column, inside the 'content' div */
#first_column {
	float: left;
	width: 400px;
	margin: 0;
	padding: 1em;
}

/* The second content column, inside the 'content' div */
#second_column {
	margin-left: 425px;
	padding: 1em;
	max-width: 400px;
}

/* For images floated to the right of the content */
.floatright {
	float: right;
	margin: 0 0 10px 10px;
	border: 1px solid #666;
	padding: 2px;
}

/*-----------------------------------------------------------
	Navigation
------------------------------------------------------------*/

/* Navigation items in the sidebar are controled here */
#sidebar_Nav {
	background-color:#99CC66;
	/*border-bottom:2px solid white;*/
	/*width: 151px; /* need to adjust the background img */
}

/* all text which is enclosed in <h2></h2> will follow these styles */
#sidebar h2 {
	padding-top:5px;
	padding-bottom:5px;
	font-size:x-small;
	color: #969695;
	font-weight: bold; 
}

/* Any unordered lists in the sidebar follow these styles */
#sidebar ul {
	list-style-type: none;
}

/* any links inside of a list element in the sidebar is controled here */
#sidebar ul li a {
	display: block; /* Display as a block or box around the text */
	color: #006600;
	font-weight:bold;
	text-decoration: none;
	border: none;
	padding: 2px;
	padding-left:5px;
}
#sidebar ul li a:hover { background-color: #006600; color: #FFFFFF;/* #555 */} /* What to do when the user mouses over an item */


/*===========================================================*/
#navigation { /* Main navigation styles */
	font-size:120%;
	float: right;
	width: 847px; /* 628px */
	/*padding:5px auto;*/
	background-color:#99CC66;
	border-bottom:1px solid white;
}

/* <ul> elements in the navigation div are controled here */
#navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Controls the navigation <ul> and nested <li> */
#navigation ul li {
	float: left; /* aligns the text left */
  	position: relative;
	width:10em; /* 7em old version (top main menu width)*/
	text-align:center;
}

/* Controls the navigation <ul> and nested <li> and next <ul> */
#navigation ul li ul {
	display: none;
  	position: absolute; 
  	top: 25px;
	left: 0;
}

/* Fix for Internet Explorer to show the submenu's */
#navigation li > ul { /* IE fix */
	top: auto;
	left: auto;
	}

/* Styles for Menu Items */
#navigation ul li a {
	display: block; /* Show menu items as blocks */
	text-decoration: none;
	color: #006600;
	border-right:1px solid white;
	background-color:#99CC66; /* IE6 Bug */
	font-weight:bold;
	padding: 5px;
	border-bottom: 0;
	}

/* Fix IE. Hide from IE Mac \*/
* html .floatholder {height: 1%;}
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */

#navigation ul li a:hover {background-color: #006600; color: #FFFFFF;} /* Hover Styles */
		
#navigation ul li ul a { padding: 4px 5px; } /* Sub Menu Styles */
		
#navigation li:hover ul, li.over ul { display: block; } /* The magic */
/*-------====================================================*/
/*-------====================================================*/
/*-------====================================================*/


/*-----------------------------------------------------------

	Footer Navigation

------------------------------------------------------------*/
#footerNav {
	list-style-type: none;
	float: right;
}
#footerNav li {	
	display: inline;
}
#footerNav li a {
	color: #fdfcfc;
	padding: 0 14px; /* padding right of list links in the footer div */
}