/*
	--------------------------------------------------
	STRUCTURE STYLES
	--------------------------------------------------
	Client:	
	Author:	
	Date:	Month, Year
		
*/

/* structure.css are the styles for the DIVs in a website and should not contain
any typographic or content-related styles for a site. The styles within are strictly
used to create the layout/structure of the website and, as such, this style sheet 
will (almost) never need to be altered by the client or back-end programmers. */

/* ----- comment styles well for better reference later! ----- */
/* ----- try to lay this out in the following sections and from top to bottom on pages ----- */



/* ===================================================================================== STYLES FOR ALL PAGES */


/* ===== Main Wrapper For Site ===== */

#repeatingBackground{
	background: #0A1920 url(../images/structure/tree_background-repeat.jpg) #0A1920 top center repeat-y;
	height:100%;
}

.treeBackground{ /* sky/tree/water image */
	background: url(../images/structure/tree_background.jpg) top center no-repeat;
	width:100%;	
}

#uber 
{
	position: relative;
	margin: 0 auto;
	width: 950px;
}


/* ===== Header ===== */

#header 
{
	float: left;
	margin: 0px 0px 0px 0px;
	width: 950px;
	position:relative;
	z-index: 2000;
}


/* ===== Search ===== */

#search {
	float: right;
	margin: 16px 0 0;
	width: 112px;
	height: 18px;
	background: url(../images/structure/search-background.gif) no-repeat;
}

#search input {
	float:left;
}

#search .inputbox {
	position: relative;
	width: 89px;
	height: 15px;
	top: 2px;
	left: 3px;
	border: none;
	background: transparent;
	font-size: 11px;
	color: #FFF;
}

#search .gobutton {
	position: relative;
	width: 15px;
	height: 15px;
	top: 2px;
	left: 6px;
}		

/* ===== Top Navigation ===== */

#topNav 
{
	float: right; 
	margin: 0px 0px 0px 0px;
	padding: 16px 0px 0px 0px;
	text-align: left;
}

/* ===== Sitemap ===== */

.siteMapSectionHeading
{
    font-size:large;
}

.siteMapSection
{
    width:48%; 
    padding-right: 2%;
    float:left;
}

/* ===== Logo ===== */

#logo 
{
	float: left;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	width: 211px;
	height: 103px;
	overflow: hidden;
}

#interiorBanner
{
     width:936; 
     height:160;
     position:absolute;
}


/* ===== Main Navigation ===== */

#mainNav 
{
	position: absolute;
	margin: 0px;
	width: 739px;
	z-index: 1000;
	top:63px;
	left:211px;
}


/* ===== Main Content Container ===== */

#main 
{
	position: relative;
	float: left;
	width: 950px;
	background:#FFF;
	overflow:hidden;
	font-family: Arial, Helvetica, sans-serif;
	min-height: 420px;
}

/* ===== Footer ===== */

#footer 
{
	margin: 0px;
	padding: 0px;
	width: 950px;
	height:101px;
	position:relative;
	background:url(../images/structure/footer-background.gif) top left repeat-x;
}
#footer p{
	font-size:11px;	
	padding:0px;
}
#footerLogo{
	top:25px;
	left:27px;
	width:102px;
	height:47px;
	position:absolute;
}
	
#footerText 
{
	top:25px;
	left:145px;
	width:500px;
	height:56px;
	position:absolute;
	overflow: hidden;
}

#footerNav 
{
	float: left;
	clear: both;
	margin: 0;
	padding: 0;
	width: 500px;
	text-align: left;
	overflow: hidden;
}

	#esol 
	{
		float: right;
		margin: 12px 10px 0px 0px;
	}

		#ontarioLogo
		{
			margin: 0px; padding: 0px;	
			text-align: right;
		}

			#ontarioLogo a
			{
				display: block;
				margin: 0px 0px 0px 0px;
			}

			#ontarioLogo span
			{
				display: block;
				margin: 0px; padding: 0px;
			}
		


/* ===================================================================================== STYLES HOME PAGE */


/* ===== Banner ===== */

#homepageBannerContainer 
{
	margin: 7px 0px 7px 7px;
	width: 936px;
	height: 263px;
	overflow: hidden;
}
	
	#homepageBanner 
	{
		/*display: none;*/ /* Display none if using rotating banners */
	}

/* ===== Local Towns ===== */

#localTowns{
	overflow:hidden;
	width:950px;
	height:33px;
}
#localTowns img{
	border:none;	
}

#localTowns.interior
{
    margin-left:-7px;
    padding-bottom: 7px;
}


/* ===== Left Content ===== */

#contentLeft 
{
	float: left;
	padding: 6px 0px 6px 6px;
	width: 944px;
	overflow:hidden;
	background:url(../images/structure/home-content-background.gif) top left repeat-x;
}
#contentLeft h1{
	font-size:14px;
	font-family:Futura, Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	color:#FFF;
	padding:10px 0px 29px 17px;
}
/* ---- Discover Column ---- */
#homeDiscoverColumn{
	float:left;
	width:187px;
	height:295px;
	margin-right:5px;
	padding-left:1px;
	overflow:hidden;
	position:relative;
	background:url(../images/structure/home-discover-background.jpg) top left no-repeat;
}
#photoGallery{
	position:absolute;
	width:188px;
	height:47px;
	top:37px;
	left:1px;
}
#planYourTrip{
	position:absolute;
	height:61px;
	top:165px;
	left:1px;
}
#planYourTripInt{
	margin-top: 7px;
	width:221px;
}
#planLinks{
	position:absolute;
	height:61px;
	top:237px;
	left:1px;
}
#planLinksInt{
	margin-top:5px;
	width:221px;
}
#planLinks ul, #planLinksInt ul{
	margin-left:30px;
}
#planLinks li, #planLinksInt li{
	list-style-image:url(../images/structure/plan-arrow.gif);
	padding-bottom:2px;
}
#planLinks li a, #planLinksInt li a{
	padding:0px;
	margin:0px;
	color:#5e5e5e;
	text-decoration:none;
}
#planLinks li a:hover, #planLinksInt li a:hover{
	color:#000000;
	text-decoration:underline;
}
#discoverArrow{ /* sits on top of image in photo gallery */
	background:url(../images/structure/discover-arrow.gif) top left no-repeat;
	width:20px;
	height:10px;
	position:absolute;
	top:36px;
	left:13px;
}
/* ---- Welcome Column ---- */
#homeWelcomeColumn{
	float:left;
	width:273px;
	height:295px;
	margin-right:5px;
	overflow:hidden;
	position:relative;
	background:url(../images/structure/home-welcome-background.jpg) top left no-repeat;
}
#welcomeMap{
	padding-left:3px;
}
#welcomeText{
	position:absolute;
	top:60px;
	left:180px;
	width:76px;
}
#welcomeMapGuide{
	position:absolute;
	top:235px;
	left:21px;
}
/* ---- News Column ---- */
#homeNewsColumn{
	float:left;
	width:271px;
	height:295px;
	margin-right:5px;
	overflow:hidden;
	background:url(../images/structure/home-news-background.jpg) top left no-repeat;
}
#newsEvents{
	width:245px;
	max-height:225px;
	overflow:hidden;
	padding:0 0 0 16px;
}
#newsEvents a {
	font-size:1.2em;
	text-decoration:none;
	color:#e25a11;
}

#seeMoreEvents
{
    padding-left: 16px;
    color:#E25A11;
    font-size:1.2em;
    text-decoration:none;   
}

#newsEvents p{
	font-size:1.2em;
	padding-bottom:1em;
	text-decoration:none;
	color:#5b5b5b;
}

#newsEvents a:hover {
	text-decoration:underline;
}

/* ---- Calendar Column ---- */
#homeCalendarColumn{
	float:left;
	width:191px;
	height:295px;
	margin-right:5px;
	overflow:hidden;
	position:relative;
	background:url(../images/structure/home-calendar-background.jpg) top left no-repeat;
}
#weatherForecast{
	float:left;
	width:180px;
	height:110px;
	top:178px;
	left:6px;
	position:absolute;
	border:1px solid #e0e1e2;
	margin-left:0px;
}

/* ===== Right Content ===== */
		
#contentRight 
{
	float: left;
	width: 180px;
	padding: 10px 0 10px 10px;
}




/* ===================================================================================== STYLES FOR CONTENT PAGES */

/* ===== Banner ===== */

#interiorBannerContainer 
{
    position: relative;
	margin: 0 0 7px 0px;
	width: 936px;
	height: 160px;
	overflow: hidden;
}
#interiorBannerContainer .supplementImage
{
	position: absolute;
	right: 0;
	top: 0;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	z-index: 100;
}

/* Class for each interior page */
.welcomeBanner{
	background:url(../en/images/interiorBanners/welcome-banner.jpg) top left no-repeat;	
}
.stayBanner{
	background:url(../en/images/interiorBanners/stay-banner.jpg) top left no-repeat;	
}
.dineBanner{
	background:url(../en/images/interiorBanners/dine-banner.jpg) top left no-repeat;	
}
.experienceBanner{
	background:url(../en/images/interiorBanners/experience-banner.jpg) top left no-repeat;	
}
.joinBanner{
	background:url(../en/images/interiorBanners/join-banner.jpg) top left no-repeat;	
}
.learnBanner{
	background:url(../en/images/interiorBanners/learn-banner.jpg) top left no-repeat;	
}
.genericBanner{
	background:url(../en/images/interiorBanners/generic-banner.jpg) top left no-repeat;	
}
/* ===== Actions and Breadcrumbs ===== */

#actionsContainer 
{
	position: relative;
	float: left;
	width: 707px;
	height:40px;
	margin: 0;
	background-color: #e4ebf4;
}
#actionsContainer.wide
{
	width: 936px !important;
}
#breadcrumbs 
{
	float: left;
	padding: 13px 0px 5px 29px;
	width: 360px;
	color: #505050;
	overflow: hidden;
	font-family: Arial, Helvetica, sans-serif;
	font-size:11px;
}

#actions 
{
	float: right;
	padding: 13px 17px 0px 0px;
	text-align: right;
}	

#actions form 
{
	display: inline;
}


/* ===== Interior Layout ===== */

.mainInterior 
{
	background: #FFF;
	padding:7px;
	width:936px !important;
}

#contentInt 
{
	float: left;
	padding: 18px 20px 20px 29px;
	width: 658px;
	overflow: hidden;	
	min-height: 375px;	
}
#contentInt.wide{
	width: 901px !important;
	clear: both;
}
#contentInt p{
	color:#414141;
	font-family: Helvetica, Arial, sans-serif;
	line-height: 1.6em;
	font-size: 1.2em;
}
#contentIntRight{
	float: right;
	width: 221px;
}
#contentIntRight.wide
{
    display:none;
}

/* -- This is a full width interior - used when there is no sub navigation on the page -- */

#contentInt_wide 
{
	float: left;
	padding: 10px 0 20px 10px;
	width: 780px;
	overflow: hidden;
	background-color: #fff; /* This hides mainInterior's bg image */
}

/* styles for interior images */

a img.floatright, 
:link img.floatright, 
:visited img.floatright, 
:hover img.floatright, 
:active img.floatright,
a img.floatleft, 
:link img.floatleft, 
:visited img.floatleft, 
:hover img.floatleft, 
:active img.floatleft {
	border:5px solid #dddddd;
}

/* fix for the calendar overlap in ie */
table tbody tr td table tbody tr td div div.Calendar
{
    width:270px !important;   
}


/* ----- END OF TEMPLATE ----- */
