@charset "utf-8";
/* CSS Document */

img {
	border: 0px;
	}

body {
	background: url(images/bg-checkerpattern.png);
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color: #333333;
}

#maincontainer {
	width: 820px;
	height: 680px;
	position: relative;
	margin: auto;
}

#maincontainer-index {
	width: 820px;
	height: 600px;
	position: relative;
	margin: auto;
}

a {
	color: #F38020;
	text-decoration: none;
	outline: none;
}

a:hover {
	text-decoration: underline;
}

.homebg {
	background:#ccc url(images/bg-homepage.jpg) no-repeat;
	}

.roombg {
	background:#ccc url(images/bg-rooms.jpg) no-repeat;
	}

.meetpurbg {
	background:#ccc url(images/bg-meetpur.jpg) no-repeat;
	}

.amenitiesbg {
	background:#ccc url(images/bg-amenities.jpg) no-repeat;
	}

.locationsbg {
	background:#ccc url(images/bg-location.jpg) no-repeat;
	}
	
.promotions {
	background:#ccc url(images/bg-promotions.jpg) no-repeat;
	}

.pressbg {
	background:#ccc url(images/bg-press.jpg) no-repeat;
	}

.spacesbg {
	background:#ccc url(images/bg-spaces.jpg) no-repeat;
	}

#logo {
	position: absolute;
	top: 60px;
	left: 37px;
}



#mainnav {
	color: white;
	font-family:arial, Helvetica, sans-serif;
	font-size:12px;
	list-style: none;
	position: absolute;
	padding: 0;
	margin: 0;
	top: 120px;
	text-transform:uppercase;
	text-align: right;
}


.homebg ul#mainnav {
	right: 20px;
	top: 400px;
}

.homebg ul#mainnav a:hover {


}

.homebg h1 {
	position: absolute;
	bottom: 30px;
	left: 38px;
}

#mainnav li {
 	line-height: 18px;
}

#mainnav a {
	color: white;
	text-decoration: none;
	display:block;
	padding-right: 60px;
	width: 165px;
	background: url(images/icon-arrow-white-trans.png) no-repeat 190px 4px;
	
}

#mainnav a:hover {
	color: #e3e3e3 !important;
	background: url(images/icon-arrow-white.png) no-repeat 190px 4px;
}

li.current a{
	background: url(images/icon-arrow-white.png) no-repeat 190px 4px !important;

}

#maincontent {
	background: url(images/bg-shadow.png);
	width: 581px;
	height: 648px;
	position:absolute;
	top: 30px;
	right: 30px;
}

.bottom-bar {
	position: absolute;
	bottom: 40px;
	right: 35px;
	width: 520px;
	height:5px;
	background-color:#e6e6e6;
	z-index: 3;
}

.slideshow-meetpur {
	position: absolute;
	top: 20px;
	left: 25px;
	width: 522px;
	height: 422px;
	overflow:hidden;
}

.slideshow {
	position: absolute;
	overflow:hidden;
	top: 20px;
	left: 25px;
	width: 523px;
	height: 276px;
}

.location div.slideshow {
	top: 80px;
}

.slideshow-spaces {
	position: absolute;
	width: 345px;
	height: 276px;
	overflow:hidden;
	text-align:center;
	top: 20px;
	right: 35px;
}

.slidepanel {
	width: 265px;
	height: 180px;
	position: absolute;
	left:173px;
	bottom: 50px;

}

.bookingmask-slider {
	width: 211px;
	height: 180px;
	background: url(images/toggle-bg.png) no-repeat;
	margin-left: 47px;
	padding-top: 40px;
}

.bookingmask-slider form {
	margin-left: 10px;
	font-size: 10px;
}

.bookingmask-slide-bt {
	background: url(images/button-check-toggle.png);
	display:block;
	width: 47px;
	height: 180px;
	float: left;
	z-index:10;
	text-indent: -2000px;
}


.floorplan {
	position: absolute;
	top: 20px;
	left: 24px;
	z-index:101
}

.spacetable {
	position: absolute;
	bottom: 50px;
	right: 40px;
}

.spacetable td {
	background: #E6E6E6;
}

.spacetable th {
	color: #CCCCCC;
}


#prev {
	position: absolute;
	z-index: 100;
	top: 130px;
	left: 25px;
	width: 20px;
	height: 41px;
	display:block;
	background:url(images/Left-hole.png) no-repeat;
	text-indent: -9999px;
}

#prev:hover {
	background:url(images/Left-orange.png) no-repeat;
}


#next {
	position: absolute;
	z-index: 100;
	top: 130px;
	right: 33px;
	width: 20px;
	height: 41px;
	display:block;
	background:url(images/Right-hole.png) no-repeat;
	text-indent: -9999px;
}

#next:hover {
	background:url(images/Right-orange.png) no-repeat;
}


#maincontent h1 {
	position: absolute;
	top: 312px;
	left: 25px;
	text-indent: -9999px;
}

.title-PurRooms {
	background:url(images/title-pur-rooms.gif) no-repeat;
	width: 250px;
	height: 31px;
}

.title-King {
	background:url(images/title-pur-king.gif) no-repeat;
	width: 133px;
	height: 31px;
}

.title-Double {
	background:url(images/title-pur-double.gif) no-repeat;
	width: 179px;
	height: 31px;
}

.title-Vue {
	background:url(images/title-pur-vue.gif) no-repeat;
	width: 120px;
	height: 31px;
}

.title-MeetPur {
	background:url(images/title-bon-jour.gif) no-repeat;
	width: 156px;
	height: 31px;
	top: 459px !important;
}

.title-Amenities {
	background:url(images/title-amenities.gif) no-repeat;
	width: 471px;
	height: 31px;
	top: 50px !important ; 
	left: 55px !important ;
}

.title-Location{
	background:url(images/title-downtown-quebec.gif) no-repeat;
	width: 301px;
	height: 31px;
}

.title-strochguide{
	background:url(images/title-st-roch-guide.gif) no-repeat;
	width: 320px;
	height: 31px;
	top: 50px !important;
}

.title-Directions{
	background:url(images/title-directions-to-pur.gif) no-repeat;
	width: 170px;
	height: 31px;
}

.title-Promotions {
	background:url(images/title-promotions.gif) no-repeat;
	top: 40px !important;
	width:301px;
	height: 31px;
}

.title-Spaces {
	background:url(images/title-spaces-at-pur.gif) no-repeat;
	width: 253px;
	height: 31px;
}

.title-Spaces-title {
	text-indent: 0px !important;
	font-size:25px; font-weight: normal; color: #FF9900;
}

.title-Press {
	background:url(images/title-bon-jour.gif) no-repeat;
	width: 156px;
	height: 31px;
}

.title-quebec-city-sights {
	background:url(images/title-quebec-city-sights.gif) no-repeat;
	top: 40px !important;
	width: 301px;
	height: 31px;
	}



.sights ul#subnav {
	top: 150px !important; 
}

.sights div#maincopy {
	top: 150px;
}

.promotions div#maincopy {
	top: 80px;
	left: 20px;
	
}

.meetpur div#maincopy {
	top: 500px;
	left: 20px;
}

.sightlist {
	border-bottom: 1px dotted #666;
	margin: 0px 10px;
	padding:10px 0;
}

.sightlist img {
	float: left; 
	margin: 0 5px 0px 0;
}

#subnav {
	margin: 0;
	padding: 0;
	position:absolute;
	top: 372px;
	left: 25px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	text-transform:uppercase;
	list-style: none;
}

.location #subnav {
	top: 400px;
}

#subnav a {
	color: #333333;
	text-decoration: none;
	display: block;
	height: 20px;
	line-height: 20px;
	width: 140px;
	border-bottom: 1px dotted #FAAF3B;
	
}

#subnav a:hover {
	color: #F38020;
	background: url(images/icon-arrow.png) no-repeat 125px 4px;
}

#maincopy {
	width: 314px;
	position: absolute;
	top: 370px;
	right: 50px;
}

.location #maincopy {
	top: 400px;
}

.promotions #maincopy {
	width: 487px;
	margin-left: 17px;
	margin-top: 25px;
}

.promotions #maincopy img{
	z-index: 3;
	margin-top: -15px;
	float: left;
	padding-right: 15px;
}

.promotions #maincopy h2 img{
	z-index: 3;
	margin-top: 15px;
	float: none;
}

.promo-item {
	border-bottom: 1px solid #ccc;
	padding-bottom: 15px;
	clear: both;
}

.booknow {
	position: absolute;
	top: 285px;
	right: 33px;
	display:block;
}

.booknow2 {
	padding: 3px;
	margin-top: 5px;
	background-color: #F38020;
	color: white;
}

.booknow2:hover{
	border: 1px solid #F38020;
	background-color: #Fff;
	color: #F38020;
	text-decoration: none;
}

.amenities-thumb {
	position: absolute;
	bottom: 50px;
	right: 50px;
}

#scrollup{
	position: relative;
	overflow: hidden;
	margin: 10px auto;
	background: url(images/bg-bookingmask.jpg);
	width: 820px;
	height: 41px;
}

 .headline {
   position: absolute;
   top: 210px;
   left: 30px;
   height: 38px;
   width:670px;
 }
 
 .headline img {
 float: left;
 }


#footer {
	position: relative;
	margin: 10px auto;
	width: 820px;
	text-align:center;
}

.direction-nav {
	position: absolute;
	top: 0px;
	left: 62px;
	list-style: none;
	display: block;
	padding: 0;
	margin: 0;
}

.direction-nav li {
	display: inline;
}

.direction-nav li a{
	float: left;
	padding: 5px;
	border:1px solid #F38020;
	border-bottom: none;
	background: white;
	margin: 0 1px;
	color:#F38020;}

.direction-nav li a:hover, .direction-nav li a.selected {
	float: left;
	padding: 5px;
	background: #F38020;
	margin: 0 1px;
	color:white;
	text-decoration: none;
}

.on {
	float: left;
	background: #F38020 !important;
	color:white !important;
}

.direction {
	position: absolute;
	top: 24px;
	left: 0px;
	width: 315px;
	border: 1px dotted #F38020;
	margin: 0;
	padding: 10px 0 10px 0;
}

.direction li, .direction p {
	margin: 0px 10px 0px 52px;
}

.hide {
	display: none;
}

.printer {
	position: absolute;
	left: 5px;
	width: 35px
}


.marker {
	background:url(images/icon-spot-on.png);
	width: 17px;
	height: 17px;
	z-index:10;
	color: white;
	text-align:center;
	line-height: 17px;
}

.marker:hover {
	background:url(images/icon-spot-off.png);
	text-decoration: none;
	}

.canvasbase {
	position: absolute;
	background: #666666;
	top: 400px;
	right: 40px;
	width: 350px;
	height: 205px;
	z-index:2;
}


.canvas {
	position: absolute;
	background: #666666;
	top: 400px;
	right: 40px;
	width: 350px;
	height: 205px;
	z-index:2;
}

.canvas p {
	width: 138px; /*decreased for padding */
	display:block;
	position: absolute;
	color: white;
	margin: 20px;
	text-align: left;
	padding-bottom: 10px;
	border-top: 3px solid white;
	border-bottom: 1px solid white;
}


.canvas img {
	width: 180px;
	position: absolute;
	right:0;
	height: 205px;
}

.canvas span {
	display: block;
	width: 136;
	font-size: 14px;
	font-weight: bold;
	padding: 5px 0 20px 0; 
}

.purmap {
	position: relative;
	width: 310px;
	height: 110px;
}

.one {
	position: absolute;
	top: 92px;
	left: 186px;
}

.two {
	position: absolute;
	top: 153px;
	left: 145px;
}

.three {
	position: absolute;
	top: 150px;
	left: 174px;
}

.four {
	position: absolute;
	top: 147px;
	left: 198px;
}

.five {
	position: absolute;
	top: 172px;
	left: 229px;
}

.six {
	position: absolute;
	top: 174px;
	left: 286px;
}

.seven {
	position: absolute;
	top: 144px;
	left: 241px;
}

.eight {
	position: absolute;
	top: 139px;
	left: 270px;
}

.nine {
	position: absolute;
	top: 135px;
	left: 299px;
}

.ten {
	position: absolute;
	top: 131px;
	left: 326px;
}

.eleven {
	position: absolute;
	top: 90px;
	left: 361px;
}

.twelve {
	position: absolute;
	top: 124px;
	left: 399px;
}

.thirteen {
	position: absolute;
	top: 80px;
	left: 434px;
}

.signup {
	position: absolute;
	left: 13px;
	height: 40px;
	bottom: 20px;
	background-color: #FF9933;
	color: white;
	width: 551px;
	line-height: 40px;
}

.promo-item {
	text-transform: uppercase;
}

.nav { padding: 5px; text-align:right;}

.nav a { padding: 0 5px; }
.nav a.highlight { color: #000; font-weight: bold; }