/*
	Recall that width just sets the size of the content area within an element - it does not including 
	padding, border size, or margin values.  Thus if you are expecting a fixed width and you adjust an
	element's padding, the total width of the element has changed due to this new padding value.
*/

@import url("/css/contribute.css");	/* Place this import here so that Contribute users can't overwrite any of the following CSS.  Note that the styles in contribute.css are strictly for main content of the page (non-layout styles). */

/* == Global Styles ===================================================================================== */
html {
	margin: 0px;	/* Safety first. */
	padding: 0px;	/* Safety first. */
}

body {
	width: 770px;  					/* Set width of the entire site. */
	margin: 0px auto 20px auto;		/* The "auto" centers the page left-right. */
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	background-image: url("/images/bgpattern.jpg");
	/* border: 1px solid cyan; */
}

p, h1, h2, h3 {
	margin: 0px;	/* Safety first. */
	padding: 0px;	/* IE and Mozilla have different default values, so explicitly set them here. */
}

#outerWrapper {
	margin: 0px;													/* Safety first. */
	padding: 0px;													/* Safety first. */
	background: repeat-y url("/images/leftnav/navbgcolumn.gif");	/* The left nav color column must be placed in the container for all three columns. */
	border-left: 1px solid #9B9B9B;
	border-right: 1px solid #9B9B9B;
	border-bottom: 1px solid #9B9B9B;
	/* border: 1px solid tomato; */
}

body#eventJumpPage #outerWrapper {
	background: repeat-y url("/images/leftnav/navbgcolumn_gray.gif");	/* Left nav column color for the jump pages. */
}

/* == Header Styles ===================================================================================== */
#header {
	margin: 0px;											/* A change here may necessitate a change in the value for width either here or else where. */
	padding: 0px;											/* A change here may necessitate a change in the value for width either here or else where. */
	background: no-repeat url("/images/header/bgtop.jpg");  /* This graphic is exactly 770px wide by 99px tall. */
	height: 99px;
	/* border: 1px solid tomato; /* TEST */
}

#WSCTClogo {
	padding-left: 16px;
	padding-top: 15px;
	float: left;
	/* border: 1px solid cyan;	/* TEST */
}

/* -- Upper Right Nav (in header) ----------------------------------------------------------------------- */
#headerNav {
	padding-top: 10px;
	padding-right: 12px;
	text-align: right;
	font-size: 0.78em;
	/* border: 1px solid yellow;	/* TEST */
}

#headerNav a {
	color: #474F60;
	text-decoration: underline; 
}

#headerNav a:hover {
	color: #996633;
	text-decoration: none; 
}

/* -- File Tab Nav Styles (in header) ------------------------------------------------------------------- */
/* 
	The five major sections of the site are: aboutUsSection, ourSpaceSection, 
	ourServicesSection, bookEventSection, and whileAtWsctcSection.
*/
#topNav { 
	clear: left;				/* Don't float next to anything. */
	list-style: none;			/* Remove the bullets from the list items. */
	margin: 0px 0px 0px 25px;	/* Required for cross compatibility. */
	padding: 0px;				/* Required for cross compatibility. */
	/* border: 1px solid lightgreen;	/* TEST */	
}
ul#topNav li {
	float: left;				/* Put each list item all on the same line. */
	padding: 14px 0px 0px 0px;	/* These values must be exact relative to graphic size, etc. */
}

/* "Home" tab of the top nav system: */
ul#topNav li#FIR_home a {
	background: no-repeat url("/images/topnav/nav_home_off.gif");	/* Default graphic to display for the home tab of the top nav system. */
	width: 48px;													/* This graphic is exactly 48px by 22px. */
	height: 22px;													/* This graphic is exactly 48px by 22px. */
	display: block;													/* Required to display the graphic. */
}

ul#topNav li#FIR_home a:hover {
	background: no-repeat url("/images/topnav/nav_home_on.gif");	/* The rollover graphic to display for the home tab of the top nav system. */
}

body#homePage ul#topNav li#FIR_home a {
	background: no-repeat url("/images/topnav/nav_home_here.gif");	/* If the body tag of the current page has an id of homePage, then display this graphic for the home tab of the top nav system. */
}

/* "About Us" tab of the top nav system: */
ul#topNav li#FIR_aboutUs a {
	background: no-repeat url("/images/topnav/nav_about_us_off.gif");
	width: 68px;
	height: 22px;
	display: block;	
}

ul#topNav li#FIR_aboutUs a:hover {
	background: no-repeat url("/images/topnav/nav_about_us_on.gif");
}

body#aboutUsSection ul#topNav li#FIR_aboutUs a {
	background: no-repeat url("/images/topnav/nav_about_us_here.gif");
}

/* "Our Space" tab of the top nav system: */
ul#topNav li#FIR_ourSpace a {
	background: no-repeat url("/images/topnav/nav_our_space_off.gif");
	width: 74px;
	height: 22px;
	display: block;	
}

ul#topNav li#FIR_ourSpace a:hover {
	background: no-repeat url("/images/topnav/nav_our_space_on.gif");
}

body#ourSpaceSection ul#topNav li#FIR_ourSpace a {
	background: no-repeat url("/images/topnav/nav_our_space_here.gif");
}

/* "Our Services" tab of the top nav system: */
ul#topNav li#FIR_ourServices a {
	background: no-repeat url("/images/topnav/nav_our_services_off.gif");
	width: 87px;
	height: 22px;
	display: block;	
}

ul#topNav li#FIR_ourServices a:hover {
	background: no-repeat url("/images/topnav/nav_our_services_on.gif");
}

body#ourServicesSection ul#topNav li#FIR_ourServices a {
	background: no-repeat url("/images/topnav/nav_our_services_here.gif");
}

/* "Book Your Event" tab of the top nav system: */
ul#topNav li#FIR_bookYourEvent a {
	background: no-repeat url("/images/topnav/nav_book_your_event_off.gif");
	width: 107px;
	height: 22px;
	display: block;	
}

ul#topNav li#FIR_bookYourEvent a:hover {
	background: no-repeat url("/images/topnav/nav_book_your_event_on.gif");
}

body#bookEventSection ul#topNav li#FIR_bookYourEvent a {
	background: no-repeat url("/images/topnav/nav_book_your_event_here.gif");
}

/* "While at WSCTC" tab of the top nav system: */
ul#topNav li#FIR_whileAtWsctc a {
	background: no-repeat url("/images/topnav/nav_while_at_wsctc_off.gif");
	width: 108px;
	height: 22px;
	display: block;	
}

ul#topNav li#FIR_whileAtWsctc a:hover {
	background: no-repeat url("/images/topnav/nav_while_at_wsctc_on.gif");
}

body#whileAtWsctcSection ul#topNav li#FIR_whileAtWsctc a {
	background: no-repeat url("/images/topnav/nav_while_at_wsctc_here.gif");
}

/* -- Search Site Styles (in header) -------------------------------------------------------------------- */
#siteSearch {
	margin: 0px;
	padding: 16px 0px 0px 552px;
	/* border: 1px solid blue;	/* TEST */
}

#search {						/* Styles for the site search input field. */
	font-size: 10px;			/* Keep this font size a fixed value in that positioning depends upon it. */
	width: 170px;				/* This is the total length of the site search text input box. */
	padding-left: 2px;			/* Bump the text within	the input box just a bit to the right. */
	border: 1px solid #999;		/* The inside border color of the site search text input box. */
}

#searchGoButton {
	padding-bottom: 2px;
}

html>body #searchGoButton {
	padding-bottom: 1px;
}

/* -- Banner Images FIR + Styles (in header) ------------------------------------------------------------ */
/* Place a white line above and below the banner images. */
#bannerImagesBorder {
	border-top: 1px solid #FFF;  		
	border-bottom: 1px solid #FFF; 
	/*border: 2px solid tomato;*/	/* TEST */
	}

/* Displays The Appropriate Banner Image For The Given Site Section. */
#sectionHeaderImage {
	background-repeat: no-repeat;
	height: 114px;	/* Create space for all five of the section background images. */
	width: 768px;	/* Create space for all five of the section background images. */
	}

/* The five major sections of the site are: aboutUsSection, ourSpaceSection, ourServicesSection, bookEventSection, and whileAtWsctcSection (plus homePage). */
body#homePage div#sectionHeaderImage {
	height: 0px;	/* Remove the space that was reserved for the banner image, since the home page does not have a banner image. */	
}	
body#aboutUsSection div#sectionHeaderImage {
	background-image: url("/images/banners/headerimg_aboutus.jpg");
}
body#ourSpaceSection div#sectionHeaderImage {
	background-image: url("/images/banners/headerimg_space.jpg");
}
body#ourServicesSection div#sectionHeaderImage {
	background-image: url("/images/banners/headerimg_services.jpg");
}
body#bookEventSection div#sectionHeaderImage {
	background-image: url("/images/banners/headerimg_book.jpg");
}
body#whileAtWsctcSection div#sectionHeaderImage {
	background-image: url("/images/banners/headerimg_wsctc.jpg");
}
body#eventJumpPage div#sectionHeaderImage {
	background-image: url("/images/banners/headerimg_event_jump_page.jpg");
}

/* == Left Nav Styles =================================================================================== */
#leftNav {
	margin: 114px 0px 10px 0px;	/* A change here may necessitate a change in the value for width either here or else where. */
	padding: 0px 0px 10px 0px;	/* A change here may necessitate a change in the value for width either here or else where. */
	clear: left;				/* This forces all items below the header area to start on a new line regardless of the width of the header area. */
	float: left;				/* Let the center column float to the left of this first column (i.e., the left nav column). */
	width: 155px;				/* Note that the width of the blue band of the background image for the outerWrapper div is 162px. */
	font-size: 0.7em;	
	font-weight: bold;		
	/* border: 1px solid green;	/* TEST */
}

#leftNav ul {
	list-style-type: none;			/* Get rid of the bullets for all list items. */
	margin: 0px;					/* Required for cross compatibility. */
	padding: 0px 0px 0px 5px;		/* Required for cross compatibility, and bump the entire left nav list over so the leaf isn't up against the left border. */
	/* border: 1px solid tomato; 	/* TEST */	
}

#leftNav li {
	padding-top: 10px;	/* This places a spacer between each left nav system line item. */
	padding-left: 10px;	/* Push the list items over to make room for the leaf graphic. */
	/* border: 1px solid cyan; /* TEST */
}

.leftNavList a {
	text-decoration: none;
	color: #000;
	font-weight: bold;
}

.leftNavList a {
	text-decoration: none;
	color: #000;
	font-weight: bold;
}

.leftNavList a:hover {
	text-decoration: underline;
}

#leftNav ul li ul li {	/* Note that .leftNavList li { ... } doesn't work for some reason. */
	padding-top: 4px;
	/* background-color: #999999;	/* TEST */
}

.leftSubNavList a {
	font-weight: normal;
	/* display: block; <-- Doesn't appear to be needed now. */
	/* border: 1px solid black;	/* TEST */
}

/* == Content Layout Styles (non-layout content styles are in contribute.css) =========================== */
/* Mozilla and IE see this code.  Use this to adjust settings (i.e., the width value) just for IE: */
#content {
	margin: 114px 0px 0px 0px;		/* A change here may necessitate a change in the value for width either here or else where. */
	padding: 0px 0px 18px 25px;		/* A change here may necessitate a change in the value for width either here or else where. */
	float: left;
	width: 421px;					/* Set the width of the content area.  Be sure to leave adequate room for the right column (i.e., the right nav column). */
	/* border: 1px solid blue; 		/* TEST */
}

/* Only Mozilla browsers see this code (IE will not parse this code).  Use this to adjust settings (i.e., the width value) just for Mozilla browsers: */
html>body #content {
	/* Set the width of the content area.  Be sure to leave adequate room for the right column (i.e., the right nav column). */
}

/* Note: Logically, this statement " @import url("/css/contribute.css"); " belongs here, but it must appear at the begining of this file because we don't know what CSS the users may enter into this file (via Contribute). */

/* == Right Nav Styles ================================================================================== */
#rightNav {
	margin: 114px 0px 0px 0px;		/* A change here may necessitate a change in the value for width either here or else where. */
	padding: 0px 0px 10px 20px;		/* A change here may necessitate a change in the value for width either here or else where. */
	float: left;
	width: 143px;					/* If this value is too large, it will flow undernearth the id="content" div. */
	font-size: 11px;				
	padding-top: 12px;				/* Bump the entire right nav group down a bit. */
	/* background-color: aqua;		/* TEST */
	/* border: 1px solid tomato;	/* TEST */
}

#rightNav ul {
	list-style-type: none;	/* Kill the bullets in list. */
	margin: 0px;			/* This gets the UL list to the far left for IE. */
	padding: 0px;			/* This gets the UL list to the far left for Mozilla. */
}

/* -- The top 4 right nav buttons (i.e., the four user types) ------------------------------------------- */
#userType {	
	text-indent: 23px;		/* Used to align the text onto the bullet background images. */
	/* border: 1px solid cyan;	/* TEST */
}

#userType li {
	background: no-repeat url("/images/rightnav/user_bg.gif");
	height: 20px;		/* Provide sufficient height for the background image to be displayed. Note that padding-top must be adjusted when this is adjusted. */
	width: 138px;		/* Provide sufficient width for the background image to be displayed. */
	padding-top: 2px;	/* height must be adjusted when this is adjusted. */
	/* border: 1px solid black;	/* TEST */
}

#userType li {
	/* border: 1px solid black;	/* TEST */
}

#userType li a {
	color: #312A23;
	text-decoration: none; 
}
	
#userType li a:hover {
	color: #312A23;
	text-decoration: underline;	
}

/* "Meeting Planners" button of the right nav system: */
div#userPlanners li#FIR_userPlanners {
	background: no-repeat url("/images/rightnav/user_bg_current.gif");
}

div#userPlanners li#FIR_userPlanners a {
	text-decoration: none;
}

div#userPlanners li#FIR_userPlanners a:hover {
	text-decoration: none;
}

/* "Exhibitors" button of the right nav system: */
div#userExhibitors li#FIR_userExhibitors {
	background: no-repeat url("/images/rightnav/user_bg_current.gif");
}

div#userExhibitors li#FIR_userExhibitors a {
	text-decoration: none;
}

div#userExhibitors li#FIR_userExhibitors a:hover {
	text-decoration: none;
}

/* "Attendees" button of the right nav system: */
div#userAttendees li#FIR_userAttendees {
	background: no-repeat url("/images/rightnav/user_bg_current.gif");
}

div#userAttendees li#FIR_userAttendees a {
	text-decoration: none;
}

div#userAttendees li#FIR_userAttendees a:hover {
	text-decoration: none;
}

/* "Community & Public" button of the right nav system: */
div#userPublic li#FIR_userPublic {
	background: no-repeat url("/images/rightnav/user_bg_current.gif");
}

div#userPublic li#FIR_userPublic a {
	text-decoration: none;
}

div#userPublic li#FIR_userPublic a:hover {
	text-decoration: none;
}

/* -- The bottom 3 right nav buttons (i.e., the 3 event types) ------------------------------------------ */
#eventType li {
	text-align: right;	/* Right align all text in the second group of buttons of the right nav system. */
	margin-top: 4px;	/* This is the spacing between the second group of buttons of the right nav system. */
	height: 46px;		/* Provide sufficient height for the three background images to be displayed. */
	width: 138px;		/* Provide sufficient width for the three background images to be displayed. */
}

#eventType li a {
	color: #312A23;
	text-decoration: none; 
	padding-right: 50px;	/* Push the text to thre right of the photos in the background image of the second group of buttons on the right nav system. */
	display: block;			/* Try sentences as if they are all in one text block. */
	/* border: 1px solid tomato;	/* TEST */
}
	
#eventType li a:hover {
	color: #312A23;
	text-decoration: underline;	
}

/* "Conventions Exhibitions Tradeshows" button of the right nav system: */
li#FIR_eventConventions {
	background: no-repeat url("/images/rightnav/convention.jpg");
}
li#FIR_eventConventions a {
	padding-top: 2px;	/* Bump the button text down so that it's center relative to it's background image. */
}
div.eventConventions li#FIR_eventConventions {
	background: no-repeat url("/images/rightnav/convention_current.jpg");
}
div.eventConventions li#FIR_eventConventions a {
	text-decoration: none;
}
div.eventConventions li#FIR_eventConventions a:hover {
	text-decoration: none;
}
/* "Meetings Conferences" button of the right nav system: */
li#FIR_eventConferences {
	background: no-repeat url("/images/rightnav/meeting.jpg");
}
li#FIR_eventConferences a {
	padding-top: 9px;	/* Bump the button text down so that it's center relative to it's background image. */
}
div.eventConferences li#FIR_eventConferences {
	background: no-repeat url("/images/rightnav/meeting_current.jpg");
}
div.eventConferences li#FIR_eventConferences a {
	text-decoration: none;
}
div.eventConferences li#FIR_eventConferences a:hover {
	text-decoration: none;
}
/* "Banquets Receptions Special Events" button of the right nav system: */
li#FIR_eventBanquets {
	background: no-repeat url("/images/rightnav/banquet.jpg");
}
li#FIR_eventBanquets a {
	padding-top: 1px;	/* Bump the button text down so that it's center relative to it's background image. */
}
div.eventBanquets li#FIR_eventBanquets {
	background: no-repeat url("/images/rightnav/banquet_current.jpg");
}
div.eventBanquets li#FIR_eventBanquets a {
	text-decoration: none;
}
div.eventBanquets li#FIR_eventBanquets a:hover {
	text-decoration: none;
}
/* "Chef Jose" button of the right nav system: */
li#FIR_eventChef {
	background: no-repeat url("/images/rightnav/chef.jpg");
}
li#FIR_eventChef a {
	padding-top: 9px;	/* Bump the button text down so that it's center relative to it's background image. */
}
div.eventChef li#FIR_eventChef {
	background: no-repeat url("/images/rightnav/chef_current.jpg");
}
div.eventChef li#FIR_eventChef a {
	text-decoration: none;
}
div.eventChef li#FIR_eventChef a:hover {
	text-decoration: none;
}


/* == Footer Styles ===================================================================================== */
#footer {
	margin: 0px;				/* A change here may necessitate a change in the value for width either here or else where. */
	padding: 0px;				/* A change here may necessitate a change in the value for width either here or else where. */
	height: 100%;				/* Stops the footer div from flowing up into the above div's space under IE. Another way to solve this is to place a <div style="clear:both"></div> just above the footer div in the html code. */
	clear: both;
	border-top: 1px solid #FFF;
	/* background-color: purple;	/* TEST */
	/* border: 1px solid yellow; 	/* TEST */
}

#footer div {
	background-color: #467A9C;
	border: 1px solid green;
	font-size: 0.7em;			/* For accessibility reasons, avoid fixed font sizes. */
	color: #E2E2E2;
	text-align: center;
	line-height: 2.2em;  			/* Whatever the font size is, increase it by a factor of 2.2 and use that value to set line-height, this results in the text being centered within its containing parent. */	
}

#footer div a {
	color: #E2E2E2; 
	text-decoration: underline;  
}
	
#footer div a:hover {
	text-decoration: none;
}

/* == Jump Page Styles ================================================================================== */
body#userJumpPage #outerWrapper {
	background: repeat-y url("/images/leftnav/navbgcolumn_gray.gif");	/* Left nav column color for the jump pages. */
}

body#userJumpPage div#sectionHeaderImage {
	background-image:   url("/images/banners/headerimg_user_jump_page.jpg");
}

body#eventJumpPage div#sectionHeaderImage {
	background-image:   url("/images/banners/headerimg_event_jump_page.jpg");
}

/* == Home Page Styles ================================================================================== */
#homePageContent {
	padding: 12px 0px 20px 20px;
	background-color: #FFF;
	float: left;
	/* border: 1px solid tomato; */
}
#splash {
	padding-top: 5px;
	padding-right: 6px;
	float: left;
	width: 352px;
	height:	405px;
	border: 0px solid tomato;
	background-repeat: no-repeat;
}
#homePageContent table {
	background-color: #FFF;
	position: relative;
	top: -4px;
	left: -7px;
}
#homePageContent table tr {
	vertical-align: top;
}
#motto {
	background-color: #003366;
	color: #FFF;
	font-size: 0.75em;
	padding: 15px;
	/* border: 1px solid yellow; */
}
#TCC_Image div {
	background: no-repeat url("/images/home_page/TCC_Image_188.130.jpg");
	height: 130px;
	width: 374px;
	background-color: #003366;
	color: #FFF;
}
#TCC_Image div a {
	display: block;
	padding-left: 195px;
	padding-top: 15px;
	font-size: 1.05em;
	color: #FFF;
	text-decoration: none;
}
#TCC_Image div a:hover {
	text-decoration: underline;
	/*lor: #996633;*/
}
.brownLinks {
	background-color: #B8AD97;
	padding: 4px 8px;
	color: #FFFFFF;
	font-size: 0.74em;
}
#conventions_image div {
	background: no-repeat url("/images/home_page/rounded_conventions.jpg");
	height: 84px;
	width: 185px;
	font-weight: bold;
}
#conventions_image div a {
	display: block;
	padding-left: 88px;
	padding-top: 12px;
	font-size: 0.9em;
	color: #083451;
	text-decoration: none;
}
#conventions_image div a:hover {
	text-decoration: underline;
	color: #996633;
}
#meetings_image div {
	background: no-repeat url("/images/home_page/rounded_meetings.jpg");
	height: 84px;
	width: 185px;
	font-weight: bold;
}
#meetings_image div a {
	display: block;
	padding-left: 88px;
	padding-top: 22px;
	font-size: 0.9em;
	color: #083451;
	text-decoration: none;
}
#meetings_image div a:hover {
	text-decoration: underline;
	color: #996633;
}
#banquets_image div {
	background: no-repeat url("/images/home_page/rounded_banquets.jpg");
	height: 84px;
	width: 185px;
	font-weight: bold;
}
#banquets_image div a {
	display: block;
	padding-left: 88px;
	padding-top: 12px;
	font-size: 0.9em;
	color: #083451;
	text-decoration: none;
}
#chef_image div a:hover {
	text-decoration: underline;
	color: #996633;
}
#chef_image div {
	background: no-repeat url("/images/home_page/rounded_chef.jpg");
	height: 84px;
	width: 185px;
	font-weight: bold;
}
#chef_image div a {
	display: block;
	padding-left: 88px;
	padding-top: 22px;
	font-size: 0.9em;
	color: #083451;
	text-decoration: none;
}
#banquets_image div a:hover {
	text-decoration: underline;
	color: #996633;
}
.leafLink td {
	padding: 5px;
	background: no-repeat url("/images/home_page/leaf_bar.gif");
	background-position: center;
	font-size: 0.8em;
}
.leafLink td a {
	padding-left: 24px; 
	font-weight: bold;
	color: #083451;
	text-decoration: none;
}
.leafLink td a:hover {
	text-decoration: underline;
	color: #996633;
}


/* THIS APPLIES TO IE 6 ONLY */
* html #content, 
* html #rightNav, 
* html #leftNav { 
	_margin-top:0 !important;
}
ges/home_page/leaf_bar.gif");
	background-position: center;
	font-size: 0.8em;
}
.leafLink td a {
	padding-left: 24px; 
	font-weight: bold;
	color: #083451;
	text-decoration: none;
}
.leafLink td a:hover {
	text-decoration: underline;
	color: #996633;
}


/* THIS APPLIES TO IE 6 ONLY */
* html #content, 
* html #rightNav, 
* html #leftNav { 
	_margin-top:0 !important;
}