
/*
-----------------------------------------------
explorewaterlooregion.ca base styles
----------------------------------------------- */

@import 'bp/reset.css';
@import 'bp/typography.css';
@import 'bp/forms.css';

html, body {
	height: 100%; /* needed for container min-height */
	background: #F1EFE2;
	color: #706D5B;
	margin: 0;
	text-align: center;
	background: #FFF;
}

a { outline: none; }


/* Page Structure
-------------------------------------------------------------- */
#container {
  width: 960px;
  margin: 20px auto 10px auto;
  padding: 0;
  text-align: left;
  background: #FFF url(/img/content_container_bg.gif) 0 0 repeat-y;
}
#container.narrow { width: 760px; }

#header {
  padding: 0;
  margin: 0;
  height: 252px;
	background: #FFF;
	border-top: 1px solid #DDDDDD;
}

#content-container                 { padding: 0; margin: 0 230px 0 227px; }
#content-container-no-r-sidebar    { padding: 0; margin: 0 30px 0 227px; }
div#content-container,
div#content-container-no-r-sidebar { min-height: 500px; height: expression(this.scrollHeight > 500 ? "auto" : "500px"); }

#content                 { float: left; width: 100%; padding-bottom: 20px; }
#l-sidebar               { float: left; width: 207px; margin: 0; padding: 0; }
#r-sidebar               { float: right; width: 170px; margin: 0; padding-right: 25px; }
#footer                  { clear: both; text-align: center; background: #FFF; margin: 0; padding: 10px 0; border-top: 1px solid #DDD; font-size: 0.9em; color: #777777; }
#footer a                { text-decoration: none; color: #777777; }
#footer a:hover          { text-decoration: underline; }


/* Navigation
-------------------------------------------------------------- */
.header-nav {
  width: 100%;
  height: 30px;
	list-style: none;
	text-align: right;
	margin: 0;
	padding: 0;
	background: #FFF;
}
.header-nav li                 { display: inline; margin: 0; padding: 0 8px; border-left: 1px solid #D3D3D3; }
.header-nav a                  { font-size: 0.9em; color: #777777; text-decoration: none; }
.header-nav a:hover            { text-decoration: underline; }
.header-nav.change-language    { padding: 2px 0 0 0; margin: 0; background: #FFF url(/img/change_language_bg.gif) top right no-repeat; }
.header-nav.change-language li { padding: 0 17px 0 0; border: none; }

#footer-nav {
  width: 100%;
  height: 30px;
	list-style: none;
	text-align: center;
	margin: 0;
	padding: 0;
	background: #FFF;
}
#footer-nav li { display: inline; margin: 0; padding: 0 8px; border-left: 1px solid #D3D3D3; }

#site-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}
#site-nav li {
  width: 216px;
  margin: 0;
  padding: 0;
}
#site-nav a {
	display: block;
	width: 216px;
	height: 24px;
	text-decoration: none;
	text-indent: -900em;
}

#site-nav .home a                       { background: url(/content/en/img/site_nav.gif) left top no-repeat; }
#site-nav .home a:hover                 { background-position: 0 -264px; }
#site-nav .meetingsconventions a        { background: url(/content/en/img/site_nav.gif) left -24px no-repeat; }
#site-nav .meetingsconventions a:hover  { background-position: 0 -288px; }
#site-nav .artsculture a                { background: url(/content/en/img/site_nav.gif) left -48px no-repeat; }
#site-nav .artsculture a:hover          { background-position: 0 -312px; }
#site-nav .attractions a                { background: url(/content/en/img/site_nav.gif) left -72px no-repeat; }
#site-nav .attractions a:hover          { background-position: 0 -336px; }
#site-nav .dining a                     { background: url(/content/en/img/site_nav.gif) left -96px no-repeat; }
#site-nav .dining a:hover               { background-position: 0 -360px; }
#site-nav .shopping a                   { background: url(/content/en/img/site_nav.gif) left -120px no-repeat; }
#site-nav .shopping a:hover             { background-position: 0 -384px; }
#site-nav .outdoorrecreation a          { background: url(/content/en/img/site_nav.gif) left -144px no-repeat; }
#site-nav .outdoorrecreation a:hover    { background-position: 0 -408px; }
#site-nav .accommodationsspas a         { background: url(/content/en/img/site_nav.gif) left -168px no-repeat; }
#site-nav .accommodationsspas a:hover   { background-position: 0 -432px; }
#site-nav .academicsinstitutes a        { background: url(/content/en/img/site_nav.gif) left -192px no-repeat; }
#site-nav .academicsinstitutes a:hover  { background-position: 0 -456px; }
#site-nav .tourismservices a            { background: url(/content/en/img/site_nav.gif) left -216px no-repeat; }
#site-nav .tourismservices a:hover      { background-position: 0 -480px; }
#site-nav .abouttheregion a             { background: url(/content/en/img/site_nav.gif) left -240px no-repeat; }
#site-nav .abouttheregion a:hover       { background-position: 0 -504px; }

body#home #site-nav .home a { background-position: 0 -528px; }
body#meetingsconventions #site-nav .meetingsconventions a { background-position: 0 -552px; }
body#artsculture #site-nav .artsculture a { background-position: 0 -576px; }
body#attractions #site-nav .attractions a { background-position: 0 -600px; }
body#dining #site-nav .dining a { background-position: 0 -624px; }
body#shopping #site-nav .shopping a { background-position: 0 -648px; }
body#outdoorrecreation #site-nav .outdoorrecreation a { background-position: 0 -672px; }
body#accommodationsspas #site-nav .accommodationsspas a { background-position: 0 -696px; }
body#academicsinstitutes #site-nav .academicsinstitutes a { background-position: 0 -720px; }
body#tourismservices #site-nav .tourismservices a { background-position: 0 -744px; }
body#abouttheregion #site-nav .abouttheregion a { background-position: 0 -768px; }

#r-sidebar #nav              { list-style: none; margin: 0; padding: 0; }
#r-sidebar #nav li           { background: url(/img/bullet_arrow.gif) 0 3px no-repeat; margin: 0; padding: 0 0 3px 15px; }
#r-sidebar #nav li.separator { background: none; padding: 0; margin: 5px 0; border-top: 1px solid #DDD; line-height: 1px; font-size: 1px;}


/* Content
-------------------------------------------------------------- */
.member-listing         { clear: left; position: relative; width: 100%; padding: 10px 0 0 0; margin: 15px 0 0 0; border-top: 1px dotted #9E9D9D; }
.member-listing-thumb   { float: left; margin: 5px 10px 10px 0; padding: 3px; border: 1px solid #CCCCCC; }
.member-listing-feature { position: absolute; top: 19px; left: 4px; width: 57px; height: 58px; background: url(/content/en/img/feature_banner.gif) 0 0 no-repeat; }

.member-nav-container   { clear: left; width: 100%; height: 20px; padding: 10px 0 0 0; }
.member-nav-website,
.member-nav-photos,
.member-nav-info,
.member-nav-email,
.member-nav-pdf         { float: left; padding: 0 30px 0 20px; margin: 0; }

a:hover .member-nav-website,
a:hover .member-nav-photos,
a:hover .member-nav-info,
a:hover .member-nav-email,
a:hover .member-nav-pdf      { text-decoration: underline; }

.member-nav-website { background: url(/img/website_icon.gif) 0 1px no-repeat; }
.member-nav-photos  { background: url(/img/photos_icon.gif) 0 1px no-repeat; }
.member-nav-info    { background: url(/img/more_info_icon.gif) 0 1px no-repeat; }
.member-nav-email   { background: url(/img/email_icon.gif) 0 1px no-repeat; }
.member-nav-pdf     { background: url(/img/pdf_icon.gif) 0 1px no-repeat; }

#member-address-container { clear: both; float: left; width: 490px; margin: 0 10px 0 0; padding: 0; background: #F2EFE9; border: 1px solid #CCC; color: #000; }
#member-map               { float: left; width: 490px; margin: 10px 10px 0 0; height: 300px; border: 1px solid #CCC; }

#page-header     { color: #8A8A8A; background: #FDFCDC; margin: 0 0 20px 207px; padding: 0 10px 20px 20px; border-bottom: 1px solid #EDECCA; border-right: 1px solid #DDD; }
#page-header img { float: left; background-color: #FDFCDC; padding-right: 20px; margin: 0; }

h2,
h2 a       { color: #0093CA; font-size: 14px; font-weight: normal; margin: 0; }
h2 a:hover { color: #0093CA; text-decoration: underline; }
h3         { color: #000; background: #FFF url(/img/h3_bg.gif) bottom left repeat-x; font-size: 12px; font-weight: bold; margin: 0 0 5px 0; padding: 0 0 6px 3px; border-bottom: 1px solid #E3E2C7; }
h4         { color: #000; margin: 0; padding: 0 0 6px 0; }

a       { color: #000; text-decoration: none; cursor: hand; }
a:hover { text-decoration: underline; cursor: hand; }

.err       { color: #EA0505; padding: 5px; border: 1px solid #EA0505; }
.msg       { color: #000; }
.label-err { color: #EA0505; }
p.bold-err { color: #EA0505; border: 1px solid #EA0505; background: #FDFBDA; padding: 5px; }

p.download_pdf { background: url(/img/pdf_icon.gif) 0 1px no-repeat; padding: 0 0 0 20px; margin: 8px 0; }

table.r-sidebar    { margin-bottom: 5px; }
table.r-sidebar td { border: 0; padding: 0 0 3px 0; margin: 0; vertical-align: top; }

#l-sidebar a         { color: #FF4700; text-decoration: underline; }
#l-sidebar a:visited { color: #FF4700; text-decoration: underline; }

.l-nav-events-head      { margin-left: 15px; margin-top: 5px; width: 183px; height: 26px; background: url(/content/en/img/l_nav_events_head.gif) 0 0 no-repeat; }
.l-nav-packages-head    { margin-left: 15px; margin-top: 5px; width: 183px; height: 26px; background: url(/content/en/img/l_nav_packages_head.gif) 0 0 no-repeat; }
.l-nav-partners-head    { margin-left: 15px; margin-top: 5px; width: 183px; height: 26px; background: url(/content/en/img/l_nav_partners_head.gif) 0 0 no-repeat; }
.l-nav-partners2-head   { margin-left: 15px; margin-top: 5px; width: 183px; height: 26px; background: url(/content/en/img/l_nav_partners2_head.gif) 0 0 no-repeat; }
.l-nav-weather-head     { margin-left: 15px; margin-top: 5px; width: 183px; height: 26px; background: url(/content/en/img/l_nav_weather_head.gif) 0 0 no-repeat; }
.l-nav-feature-content  { margin-left: 15px; width: 163px; padding: 10px; font-size: 0.9em; background: url(/img/l_nav_feature_bg.gif) 0 0 repeat-y; }
.l-nav-feature-foot     { margin-left: 15px; width: 183px; height: 14px; background: url(/img/l_nav_feature_foot.gif) 0 0 no-repeat; }

.job-divider { margin-top: 10px; padding-bottom: 10px; border-top: 1px dotted #9E9D9D; }

table.no-border td { border: 0; }


/* Forms
-------------------------------------------------------------- */
input.text { color: #000; padding: 3px; margin: 0; }
select     { border: 1px solid #A7A6AA; font-family: inherit; }
textarea   { border: 1px solid #A7A6AA; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12px; }

.search-form         { padding: 0 0 10px 14px; }
.search-form .search {
  background: transparent;
  border: 0;
  color: #5F5F5F;
  width: 135px;
  height: 19px;
  padding: 3px 0 0 10px;
}

/* Home
-------------------------------------------------------------- */
#three-column           { float: left; width: 720px; margin-bottom: 20px; margin-top: 30px; background: url(/img/three_column_bg.gif) 0 0 repeat-y;  }
#three-column .column   { float: left; width: 210px; padding: 0 46px 0 0; }
#three-column .column a { color: #FF4700; text-decoration: underline; }

#explore-the-region   { float: left; margin-top: 30px; padding: 0 20px 20px 0; }
#explore-the-region p { margin-bottom: 10px; }
