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

/* general typography*/
body {
	margin: 0 auto;
	padding-top:5px;
	width: 900px;
	font: 75%/120% Arial, Helvetica, sans-serif;
    text-align: left;
	position:relative;
	background:url(../images/waterbg.jpg);
	
}


h1{
	font-size:14px;
	font-weight:bold;
	
}
h2{
	font-size:14px;
	font-weight:bold;
	font-variant:small-caps;
	font-family: Helvetica, Arial,sans-serif;
	
}
p{
	font-family:Arial, Helvetica, sans-serif;
}
.italic{
	font-style:italic
}
.bold{
	font-weight:bold;
}

/* topnav elements*/
#special{
	vertical-align:top;


}
#top-left{
	width: 400px;
	height: 149px;
	position:relative;
	vertical-align:top;
	z-index:25;


}

#top-right{
	width: 500px;
	height: 149px;
	position:relative;
	vertical-align:top;
	z-index:25;
}
.pull{
	margin-top:-150px;

}
#top-right-phone{
	width: 500px;
	height: 28px;
	background: url(http://www.capecodderresort.com/images/phone.png) no-repeat 0 0;
	position:relative;
	z-index:25;
}
#top-nav-shell{
	width: 500px;
	height: 47px;
	position:relative;
	margin: 0px 20px 0px 0px;
	padding: 0px 0px 0px 0px;
	z-index:25;
}
#top-nav{
	width: 500px;
	height: 47px;
	position:relative;
	float:left;
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 0px 0px;
	z-index:25;
}

ul#top-nav li{
	list-style: none;
	display: inline;
	font: 97% Arial, Helvetica, sans-serif;
	font-stretch:wider;
	font-weight: bold;
	letter-spacing: 0.04em;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	float: left;
	text-align:center;
	height:47px;
	text-decoration: none;
}
ul#top-nav li a{
	text-decoration: none;
	color: #ffffff;
	display:block;
	
}

ul#top-nav li a:hover{
	text-decoration: none;
	color:#006699;
	display:block;
	
}


ul#top-nav li.reserve { background:url(http://www.capecodderresort.com/images/reserve.png) no-repeat 0 0;
height: 47px; width:124px; padding: 25px 0px 0px 0px;}

ul#top-nav li.reserve:hover { background:url(http://www.capecodderresort.com/images/reserve-o.png) no-repeat 0 0; color:#006699;}
ul#top-nav li.reserve a:hover { color:#006699;}
ul#top-nav li.giftcard a { background:url(http://www.capecodderresort.com/images/giftcards.png) no-repeat 0 0; height: 47px; width:91px; padding: 15px 0px 0px 0px;}
ul#top-nav li.giftcard a:hover { background:url(http://www.capecodderresort.com/images/giftcards-o.png) no-repeat 0 0;}
ul#top-nav li.email a { background:url(http://www.capecodderresort.com/images/email.png) no-repeat 0 0; height: 47px; width:90px; padding: 10px 0px 0px 0px;}
ul#top-nav li.email a:hover { background:url(http://www.capecodderresort.com/images/email-o.png) no-repeat 0 0; }
ul#top-nav li.brochure a { background:url(http://www.capecodderresort.com/images/brochure.png) no-repeat 0 0%; height: 47px; width:95px; padding: 15px 0px 0px 0px;}
ul#top-nav li.brochure a:hover { background:url(http://www.capecodderresort.com/images/brochure-o.png) no-repeat 0 0%;}
ul#top-nav li.contact a { background:url(http://www.capecodderresort.com/images/contact.png) no-repeat 0 0; height: 47px; width:100px; padding: 25px 0px 0px 0px;}
ul#top-nav li.contact a:hover { background:url(http://www.capecodderresort.com/images/contact-o.png) no-repeat 0 0; }

.move a{
	padding: 0px 25px 0px 0px;
	margin: 0px 0px 0px 0px;
}
#move {
	padding: 0px 25px 0px 0px;
	margin: 0px 0px 0px 0px;
}
#move a:hover{
	padding: 0px 25px 0px 0px;
	margin: 0px 0px 0px 0px;
	color:#006699;
}

/* end topnav */


/* top panels */
.jack {
	background-color:#FF00CC;
	
}
#tophide{
	width: 900px;
	height: 200px;
	left:0px;
	top:0px;
	background-color:#d7e5dd;
	vertical-align:top;
	 margin: 0px, 0px 0px -300px;
	 text-align: left;
	 position:relative;
	 z-index:20;
}
#panel{
	width: 900px;
	height: 200px;
	left: 0px;
	top: 0px;
	background-color:#93b7ca;
	vertical-align:top;
	 margin: 0px, 0px 0px -300px;
	 text-align: left;
	 position:absolute;
	 z-index:20;
	 color:#FFFFFF;
}
#panel2{
	width: 900px;
	height: 200px;
	left: 0px;
	top: 0px;
	background-color:#93b7ca;
	vertical-align:top;
	 margin: 0px, 0px 0px -300px;
	 text-align: left;
	 position:absolute;
	 z-index:20;
}
#panel3{
	width: 900px;
	height: 200px;
	left: 0px;
	top: 0px;
	background-color:#93b7ca;
	vertical-align:top;
	 margin: 0px, 0px 0px -300px;
	 text-align: left;
	 position:absolute;
	 z-index:20;

}
#panel4{
	width: 900px;
	height: 200px;
	left: 0px;
	top: 0px;
	background-color:#93b7ca;
	vertical-align:top;
	 margin: 0px, 0px 0px -300px;
	 text-align: left;
	 position:absolute;
	 z-index:20;

}
#panel5{
	width: 900px;
	height: 200px;
	left: 0px;
	top: 0px;
	background-color:#93b7ca;
	vertical-align:top;
	 margin: 0px, 0px 0px -300px;
	 text-align: left;
	 position:absolute;
	 z-index:20;

}
.paneltext{
	padding:0px 10px 0px 10px;
	color:#ffffff;
	font-weight:600;
	
}
.paneltext a{
	text-decoration:none;
	color:#ffffff;

}
.paneltext a:hover{
	text-decoration:underline;
	color:#f0f0f0;

}
/*end top panels */


/* footer */

#footer-nav{
	width:820px;
	height:20px;
	background-color:#93b7ca;
	position:relative;
	float: right;
	margin: 10px 40px 0px 0px;
	padding: 6px 0px 0px 0px;
	color:#FFFFFF;
	font-weight:bold;
	font:Arial, Helvetica, sans-serif;
}
#footer-nav ul, #footer-nav ul li{
	list-style: none;
	margin: 0;
	padding: 0;
}
#footer-nav ul{
	text-align: center;

}
#footer-nav ul li{
	display: inline;
    margin-right: .75em;

}

#footer-nav ul li.last {
     margin-right: 0;
 }
 #footer-nav li a {
     padding: 10px .35em;
	 text-decoration: none;
	 color: #ffffff;
	
 }
 #footer-nav li a:hover{
	color:#006699;
	
}
 
 
#bottom{
	font:Arial, Helvetica, sans-serif;
	font-size:95%;
	color:#477d6c;
	margin: 10px 0px 10px 150px;
	position:relative;
	float: left;
	width:800px;
	height:15px;
	
}
#bottom a{
	color:#477d6c;
	text-decoration:none;
}
#bottom a:hover{
	color:#345d78;
}
/* end footer  */