/* SB Style Sheet --------------------------------------------------------------------*/
/* undo some default styling of common (X)HTML browsers
/*------------------------------------------------------------------------------------*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td,html,label,table,tr,td {margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,a img,:link img,:visited img {border:0;}
address,caption,cite,code,dfn,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;}
q:before,q:after {content:'';}

/* ------------------------ GLOBAL ELEMENTS ------------------------ */
body { 
	background:#dbd7d2 url(../images/bg-body.jpg) top repeat-x;
	text-align:left; 
	font:12px/16px Arial, Helvetica, sans-serif; 
	color:#1b232a;
	}

blockquote { margin-left:10px; margin-right:10px; }

h1	{ font-size:1.1em; color:#000; }
h2	{ font-size:1.1em; color:#000; }

h1 span,h2 span,h3 span	{ display:none; }

a:link,a:visited	{ color:#926819; text-decoration:none; outline:none; }
a:hover,a:active	{ color:#855c0e; text-decoration:none; outline:none; }

/* ------------------------ classes ------------------------ */
.clear	{ clear:both;}
div.clear	{ height:.01em; overflow:hidden;}
img.img-left { float:left; margin:0; padding:0;}
img.img-right { float:right; margin:0;}

/* ------------------------ main framework ------------------------ */
#wrap {
	width:983px;
	margin:0 auto;
	text-align:left;
	}

/* --- Content Container ----- */
#header-container {
	width:983px;
	float:left;
	margin:0;
	padding:0;
	}

#content-container {
	width:983px;
	float:left;
	margin:0;
	padding:0;
	}

/* ------------------------ column-left framework ------------------------ */
#column-left {
	width:303px;
	float:left;
	}

	#column-left p, #column-left h1 {
		padding:0px 0px 0px 0px;
		}


/* ------------------------ column-right framework ------------------------ */
#column-right {
	width:680px;
	float:left;
	}

	#column-right p, #column-right h1 {
		padding:0px 103px 10px 31px;
		}

/* ------------------------ logo link ------------------------ */
#CastleRock-logo {
	position:relative;
	background:url(../images/masthead.jpg);
	height:90px;
	}
	#CastleRock-logo a {	
		position:absolute;
		left:0px;
		width:0px;
		top:0px;
		height:0px; 
		}
	#CastleRock-logo a span {
		display:none;
		}

/* ------------------------ header framework ------------------------ */
#header { height:448px; } /* sets height for all non-flash headers */
	body#index #header { background:url(../images/header-index.jpg) no-repeat; }
	body#floorplans #header { background:url(../images/header-floorplans.jpg) no-repeat; }
	body#amenities #header { background:url(../images/header-amenities.jpg) no-repeat; }
	body#location #header { background:url(../images/header-location.jpg) no-repeat; }
	body#contact #header { background:url(../images/header-contact.jpg) no-repeat; }

/* ------------------------ subhead framework ------------------------ */
#subhead { height:45px; } /* sets height for all subheads */
	body#index #subhead { background:url(../images/subhead-index.jpg) no-repeat; }
	body#floorplans #subhead { background:url(../images/subhead-floorplans.jpg) no-repeat; }
	body#amenities #subhead { background:url(../images/subhead-amenities.jpg) no-repeat; }
	body#location #subhead { background:url(../images/subhead-location.jpg) no-repeat; }
	body#contact #subhead { background:url(../images/subhead-contact.jpg) no-repeat; }


/* --- Buttons ---------- */
#btn-photos {
	background: url(../images/btn-photos.jpg) no-repeat;
	height:120px;
	width:158px;
	float:left;
	}
#btn-photos a span {display:none;}
#btn-photos a {display:block; width:158px; height:110px; margin-top:10px;}
#btn-photos a:hover { background: url(../images/btn-photos.jpg) -0px -130px no-repeat; }

#btn-apply {
	background: url(../images/btn-apply.jpg) no-repeat;
	height:120px;
	width:145px;
	float:left;
	}
#btn-apply a span {display:none;}
#btn-apply a {display:block; width:145px; height:110px; margin-top:10px;}
#btn-apply a:hover { background: url(../images/btn-apply.jpg) -0px -130px no-repeat; }

#btn-site-map {
	background: url(../images/btn-site-map.jpg) no-repeat;
	height:120px;
	width:145px;
	float:left;
	}
#btn-site-map a span {display:none;}
#btn-site-map a {display:block; width:145px; height:110px; margin-top:10px;}
#btn-site-map a:hover { background: url(../images/btn-site-map.jpg) -0px -130px no-repeat; }


/* ------------ must have below column-left and column-right to clear the float ------------ */
#bottom-wrap {
	width:100%; /* fix for Safar */
	clear:both; /* important - do not remove */
	height:30px;
	}
	
/* ------ Navigation ------ */
#nav { 
	background:url(../images/nav.jpg) no-repeat; 
	width:983px; 
	height:32px; 
	margin:0;
	padding:0; 
	}

#nav span { display: none; }

#nav li, #nav a { height:32px; display:block; } /* change height here also */

#nav li { float:left; list-style:none; display:inline; position:relative; }

#nav-01 { width: 63px;}
#nav-02 { width: 98px;}
#nav-03 { width: 81px;}
#nav-04 { width: 81px;}
#nav-05 { width: 118px;}
#nav-06 { width: 53px;}
#nav-07 { width: 54px;}
#nav-08 { width: 73px;}

#nav-02, #nav-03, #nav-04, #nav-05, #nav-06, #nav-07, #nav-08 {margin-left:39px;}

/*-------------- (-79px) X position of button / (-30px) height of image from above ------------- */
#nav-01 a:hover { background:url(../images/nav.jpg)  -0px -32px no-repeat; }
#nav-02 a:hover { background:url(../images/nav.jpg) -102px -32px no-repeat; }
#nav-03 a:hover { background:url(../images/nav.jpg) -239px -32px no-repeat; }
#nav-04 a:hover { background:url(../images/nav.jpg) -359px -32px no-repeat; }
#nav-05 a:hover { background:url(../images/nav.jpg) -479px -32px no-repeat; }
#nav-06 a:hover { background:url(../images/nav.jpg) -636px -32px no-repeat; }
#nav-07 a:hover { background:url(../images/nav.jpg) -728px -32px no-repeat; }
#nav-08 a:hover { background:url(../images/nav.jpg) -821px -32px no-repeat; }


/*-------------- OPTIONAL - Keeps the hover state on each page based on body id ------------- */
body#index #nav-01 { background:url(../images/nav.jpg)  -0px -32px no-repeat; }
body#floorplans #nav-02 { background:url(../images/nav.jpg) -102px -32px no-repeat;  }
body#amenities #nav-03 { background:url(../images/nav.jpg) -239px -32px no-repeat; }
body#location #nav-04 { background:url(../images/nav.jpg) -359px -32px no-repeat; }
body#service-request #nav-05 { background:url(../images/nav.jpg) -479px -32px no-repeat; }
body#blog #nav-06 { background:url(../images/nav.jpg) -636px -32px no-repeat; }
body#apply #nav-07 { background:url(../images/nav.jpg) -728px -32px no-repeat; }
body#contact #nav-08 { background:url(../images/nav.jpg) -821px -32px no-repeat; }

/* ------------------------footer framework ------------------------ */
#footer-container {
	background: #dbd7d2 url(../images/bg-footer-container.jpg) repeat-x;
	margin:0 auto;
	}
	
#footer {
	width:983px;
	margin:0 auto;
	text-align:center;
	}

#footer p {
	color:#1b232a;
	font-size:11px;
	padding:25px 0 30px 0;
	}

#footer a:link, #footer a:visited { color:#716a61; }
#footer a:hover, #footer a:active { color:#4d473f; }


/* -- Floorplans Page --*/

.floorplans-thumbs-container { margin-left:34px;}
.floorplans { width:545px; background:#99918a; float:left;}

#jewel {
	background: url(../images/thumb-jewel.jpg) no-repeat;
	width:137px;
	height:140px;
	float:left;
	margin:0;
	padding:0;
	text-align:left;
	}
	#jewel a span {display:none;}
	#jewel a {display:block; width:101px; height:140px; margin-left:32px; }
	#jewel a:hover {background:url(../images/thumb-jewel.jpg) -32px -140px  no-repeat;}

#emerald {
	background: url(../images/thumb-emerald.jpg) no-repeat;
	width:127px;
	height:140px;
	float:left;
	margin:0;
	padding:0;
	text-align:left;
	}
	#emerald a span {display:none;}
	#emerald a {display:block; width:110px; height:140px; margin-left:17px; }
	#emerald a:hover {background:url(../images/thumb-emerald.jpg) -17px -140px  no-repeat;}

#ruby {
	background: url(../images/thumb-ruby.jpg) no-repeat;
	width:127px;
	height:140px;
	float:left;
	margin:0;
	padding:0;
	text-align:left;
	}
	#ruby a span {display:none;}
	#ruby a {display:block; width:114px; height:140px; margin-left:13px; }
	#ruby a:hover {background:url(../images/thumb-ruby.jpg) -13px -140px  no-repeat;}

#sapphire {
	background: url(../images/thumb-sapphire.jpg) no-repeat;
	width:154px;
	height:140px;
	float:left;
	margin:0;
	padding:0;
	text-align:left;
	}
	#sapphire a span {display:none;}
	#sapphire a {display:block; width:133px; height:140px; margin-left:11px; }
	#sapphire a:hover {background:url(../images/thumb-sapphire.jpg) -11px -140px  no-repeat;}

#silver {
	background: url(../images/thumb-silver.jpg) no-repeat;
	width:140px;
	height:155px;
	float:left;
	margin-bottom:20px;
	text-align:left;
	}
	#silver a span {display:none;}
	#silver a {display:block; width:125px; height:155px; margin-left:36px; }
	#silver a:hover {background:url(../images/thumb-silver.jpg) -36px -155px  no-repeat;}

#diamond {
	background: url(../images/thumb-diamond.jpg) no-repeat;
	width:140px;
	height:155px;
	float:left;
	margin-bottom:20px;
	text-align:left;
	}
	#diamond a span {display:none;}
	#diamond a {display:block; width:124px; height:155px; margin-left:0px; }
	#diamond a:hover {background:url(../images/thumb-diamond.jpg) -0px -155px  no-repeat;}
	
/* -- Amenities Page --*/
#amenities-container { margin-left:34px; }
#amenities-column-1 { width:545px; background:#99918a; float:left;}
.amenities-column-p { width:293px; float:left;  }
	.amenities-column-p ul {padding:0 0 15px 31px; color:#fff;}

#gallery-nav {
	background:url(../images/gallery-nav.jpg) no-repeat;
	width:252px;
	height:454px;
	float:right;
	}	
.gallery-img-left { width:123px; float:left; }
	.gallery-img-left a {display:block; height:111px;}
	.gallery-img-left span {display:none;}
.gallery-img-right { width:129px; float:right;}
	.gallery-img-right a {display:block; height:111px;}
	.gallery-img-right span {display:none;}

/* -- Location Page --*/
#location-container { margin:0px; }
#location-column-1 { width:680px; background:url(../images/bg-location.jpg) repeat-y; float:left;}
#location-column-left {width:183px; float:left; padding-left:34px;}
	#location-column-left p {padding:0 10px 15px 14px; color:#1d1408;}
	#location-column-left strong {color:#FFF;} 

#location-column-middle {width:184px; float:left;}
	#location-column-middle  p {padding:0 10px 15px 16px; color:#1d1408;}
	#location-column-middle strong {color:#FFF;} 

#location-column-right {width:184px; float:left;}
	#location-column-right p {padding:0 10px 15px 14px; color:#1d1408;}
	#location-column-right strong {color:#FFF;} 

#location-column-2 { width:680px; background:url(../images/bg-location.jpg) repeat-y; float:left;}
#location-column-left2 {width:183px; float:left; padding-left:34px;}
	#location-column-left2 p {padding:0 10px 15px 14px; color:#1d1408;}
	#location-column-left2 strong {color:#FFF;} 

#location-column-middle2 {width:184px; float:left;}
	#location-column-middle2  p {padding:0 10px 15px 16px; color:#1d1408;}
	#location-column-middle2 strong {color:#FFF;} 

#location-column-right2 {width:184px; float:left;}
	#location-column-right2 p {padding:0 10px 15px 14px; color:#1d1408;}
	#location-column-right2 strong {color:#FFF;} 

/* -- Contact Page --*/
#btn-map { 
	background:url(../images/btn-map.jpg) no-repeat;
	width:94px;
	height:83px;
	margin-left:31px;
	float:left;
	}
#btn-map span {display:none;}
#btn-map a {display:block; width:94px; height:83px; float:left;}
#btn-map a:hover {background:url(../images/btn-map.jpg) -0px -83px no-repeat;}

#contact-column-1 {width:310px; float:left; margin-top:10px;}
	#contact-column-1 p { width:200px; display:inline; padding:0; margin:0;}
	
#contact-column-2 {width:200px; float:left; margin-top:10px;}
	#contact-column-2 p { width:200px; display:inline; padding:0; margin:0;}