body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #FFFFFF;
}

body {
	background-color: #FFFFFF;
	text-align: center;
}
a:link {
	color: #000000;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}

img {
border:none;
}

#container {
	position: absolute;
	top: 25%;
	margin-top: -134px;
	left: 50%;
	width: 758px;
	height: 548px;
	margin-left: -399px;
}
#leafleft  {
	float:left;
	width: 39px; height:510px;
}

#leftmenu {
	float:left;
	width: 24px; height:510px;
}

#content {
	float:left;
	width: 672px; height:510px;
	padding: 0px;
	background-color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #666666;
	text-align: center;
}

#rightmenu {
	float:left;
	width: 24px; height:510px;
	text-align: left;
	margin-left: -1px;
	margin-bottom:-10;
}

#bottom {
	width: 758px; height:23px;
	margin-left:9px;
}

.imgs /* this class is used to change width and height values, and sets no distance between images */
{
margin-left: -2px; /* will makes images touch */
margin-right: -2px; /* will makes images touch */
border: none; /* removes borders */
}

a img {border-width: 0; background: top left no-repeat;}

a#suite1 img {background: url(images/16_suite1.gif); width:24px; height:84px;}
a#suite1:hover img {background: url(images/on/16_suite1.gif); width:24px; height:84px;}
a#suite2 img {background: url(images/15_suite2.gif); width:24px; height:93px;}
a#suite2:hover img {background: url(images/on/15_suite2.gif); width:24px; height:93px;}
a#suite3 img {background: url(images/14_suite3.gif); width:24px; height:82px;}
a#suite3:hover img {background: url(images/on/14_suite3.gif); width:24px; height:82px;}
a#suite4 img {background: url(images/13_suite4.gif); width:24px; height:86px;}
a#suite4:hover img {background: url(images/on/13_suite4.gif); width:24px; height:86px;}
a#suite5 img {background: url(images/12_suite5.gif); width:24px; height:83px;}
a#suite5:hover img {background: url(images/on/12_suite5.gif); width:24px; height:83px;}
a#suite6 img {background: url(images/11_suite6.gif); width:24px; height:83px;}
a#suite6:hover img {background: url(images/on/11_suite6.gif); width:24px; height:83px;}


a#amenities img {background: url(images/21_amen.gif); width:24px; height:109px;}
a#amenities:hover img {background: url(images/on/21_amen.gif); width:24px; height:109px;}
a#our_location img {background: url(images/22_location.gif); width:24px; height:97px;}
a#our_location:hover img {background: url(images/on/22_location.gif); width:24px; height:97px;}
a#directions img {background: url(images/23_directions.gif); width:24px; height:97px;}
a#directions:hover img {background: url(images/on/23_directions.gif); width:24px; height:97px;}
a#comox_suites img {background: url(images/24_langtry.gif); width:24px; height:97px;}
a#comox_suites:hover img {background: url(images/on/24_lantry.gif); width:24px; height:97px;}
a#restaurants img {background: url(images/25_restaurants.gif); width:24px; height:97px;}
a#restaurants:hover img {background: url(images/on/25_restaurants.gif); width:24px; height:97px;}

a#contact img {background: url(images/30_contact.gif); width:92px; height:23px;}
a#contact:hover img {background: url(images/on/30_contact.gif); width:92px; height:23px;}
a#rates img {background: url(images/32_rates.gif); width:96px; height:23px;}
a#rates:hover img {background: url(images/on/32_rates.gif); width:96px; height:23px;}
a#policies img {background: url(images/33_policies.gif); width:96px; height:23px;}
a#policies:hover img {background: url(images/on/33_policies.gif); width:96px; height:23px;}
a#reservations img {background: url(images/34_reservations.gif); width:93px; height:23px;}
a#reservations:hover img {background: url(images/on/34_reservations.gif); width:93px; height:23px;}