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

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: -120px;
	left: 50%;
	width: 720px;
	height: 534px;
	margin-left: -360px;
}

#leftmenu {
	float:left;
	width: 24px; height:510px;
	margin-right:-3px;
}

#content {
	float:left;
	width: 672px; height:510px;
	margin-left:2px;
	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:-10px;
	margin-right:-5px;
}

#bottom {
	width: 758px; height:24px;
	vertical-align:top;
	margin-left:-15px;
	text-align: left;
	position:relative; left:36px;
}

.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 */
}

.botimgs
{
margin-left: -1px;
margin-right: -1px;
border: none;
}

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

a#suite1 img {background: url(images/off_l6.gif); width:25px; height:93px;}
a#suite1:hover img {background: url(images/on_l6.gif); width:25px; height:93px;}
a#suite2 img {background: url(images/off_l5.gif); width:24px; height:82px;}
a#suite2:hover img {background: url(images/on_l5.gif); width:24px; height:82px;}
a#suite3 img {background: url(images/off_l4.gif); width:24px; height:83px;}
a#suite3:hover img {background: url(images/on_l4.gif); width:24px; height:83px;}
a#suite4 img {background: url(images/off_l3.gif); width:24px; height:85px;}
a#suite4:hover img {background: url(images/on_l3.gif); width:24px; height:85px;}
a#suite5 img {background: url(images/off_l2.gif); width:24px; height:84px;}
a#suite5:hover img {background: url(images/on_l2.gif); width:24px; height:84px;}
a#suite6 img {background: url(images/off_l1.gif); width:24px; height:84px;}
a#suite6:hover img {background: url(images/on_l1.gif); width:24px; height:84px;}


a#amenities img {background: url(images/off_r1.gif); width:24px; height:93px;}
a#amenities:hover img {background: url(images/on_r1.gif); width:24px; height:93px;}
a#our_location img {background: url(images/off_r2.gif); width:24px; height:97px;}
a#our_location:hover img {background: url(images/on_r2.gif); width:24px; height:97px;}
a#directions img {background: url(images/off_r3.gif); width:24px; height:97px;}
a#directions:hover img {background: url(images/on_r3.gif); width:24px; height:97px;}
a#comox_suites img {background: url(images/off_r4.gif); width:24px; height:97px;}
a#comox_suites:hover img {background: url(images/on_r4.gif); width:24px; height:97px;}
a#restaurants img {background: url(images/off_r5.gif); width:24px; height:97px;}
a#restaurants:hover img {background: url(images/on_r5.gif); width:24px; height:97px;}

a#contact img {background: url(images/off_b1.gif); width:95px; height:24px;}
a#contact:hover img {background: url(images/on_b1.gif); width:95px; height:24px;}
a#rates img {background: url(images/off_b3.gif); width:97px; height:24px;}
a#rates:hover img {background: url(images/on_b3.gif); width:97px; height:24px;}
a#policies img {background: url(images/off_b4.gif); width:96px; height:24px;}
a#policies:hover img {background: url(images/on_b4.gif); width:96px; height:24px;}
a#reservations img {background: url(images/off_b5.gif); width:93px; height:24px;}
a#reservations:hover img {background: url(images/on_b5.gif); width:93px; height:24px;}