/* CSS Document 

	Date Created: 	November, 2008
	Developed By:	Peter Scott / www.chrysalis.com.jm
	Last Modified: 	Nov. 24, 2008

*/

@import url('typography.css');
@import url('tabs.css');
@import url('form.css');

.clear {
	clear: both;
}

body {
	margin:0px;
	padding:0px;
	background-color: #231F20;
	font-family: Helvetica, Arial, san serif;
	font-size: 11px;
	font-style: normal;
	color:#000;
	line-height:18px;
}
.container {
	width:820px;
	margin:0 auto;
	position:relative;
	height:auto;
	z-index: 1;
}
#header {
	border-bottom: 1px solid #fffeff;
	height:auto;
}
#header .container {
	height:51px;
}
#header .container ul {
	padding: 5px 0 0 0;
}
#nav{ overflow:hidden; height: 36px; padding: 0; list-style: none;}
#nav li{float: left; height: 36px;}
#nav li a{background: url(../images/nav.gif) no-repeat 0 0;display: block;overflow:hidden;text-indent:-10000px;height:36px;}
#nav li #nav-home {background-position:0 0;width: 111px;}

#nav li #nav-planning {background-position:-111px 0;width: 92px;}

#nav li #nav-interior {background-position:-203px 0;width: 87px;}

#nav li #nav-development {background-position:-290px 0;width: 124px;}

#nav li #nav-project {background-position:-414px 0;width: 122px;}

#nav li #nav-graphic {background-position:-536px 0;width: 91px;}

#nav li #nav-about {background-position:-627px 0;width: 88px;}

#nav li #nav-contact {background-position:-715px 0;width: 85px;}

#pattern {
	position: absolute;
	margin-top: -398px;
	z-index: 10;
}
#holder {
	position: relative;
	background: url(../images/bg_stripebar.jpg) repeat-x left bottom;
	width: 100%;	
	height: 380px;
	z-index: 11;
}
#content {
	position: absolute;
	background: url(../images/bg_main.png) no-repeat;
	z-index: 30;
	width: 372px;
	height: 305px;
	margin: 40px 0 0 330px;
	padding: 30px;
}
#subcontent {
	position: absolute;
	background: url(../images/bg_main.png) no-repeat;
	z-index: 30;
	width: 372px;
	height: 315px;
	margin: 40px 0 0 330px;
	padding: 20px 30px 30px 30px;
}
#back {
	text-align: right;
	color: #231F20;
}
#back a {
	color: #231f20;
}
#rcol {
	float: right;
	width: 220px;
}

#footer {
	padding: 35px 130px 0 0;
	color: #fff;
}
#footer {
	text-align: right;
	font-size: 10px;
}
#footer a {
	color: #fff;
	text-decoration: none;
}
.holder {
	float: left;
}
#content .scroll-pane {
	width: 150px;
	overflow: auto;
	float: left;
	height: 300px;
}
#subcontent .scroll-pane {
	width: 150px;
	overflow: auto;
	float: left;
	height: 280px;
}
#content .scroll-pane img{
	margin: 0 0 15px 0;
}
#subcontent .scroll-pane img {
	margin: 0 0 8px 0;
}
.osX .jScrollPaneTrack {
	background: url(../i/osx_track.gif) repeat-y;
}
.osX .jScrollPaneDrag {
	background: url(../i/osx_drag_middle.gif) repeat-y;
}
.osX .jScrollPaneDragTop {
	background: url(../i/osx_drag_top.gif) no-repeat;
	height: 6px;
}
.osX .jScrollPaneDragBottom {
	background: url(../i/osx_drag_bottom.gif) no-repeat;
	height: 7px;
}
.osX a.jScrollArrowUp {
	height: 24px;
	background: url(../i/osx_arrow_up.gif) no-repeat 0 -30px;
	
}
.osX a.jScrollArrowUp:hover {
	background-position: 0 0;
}
.osX a.jScrollArrowDown {
	height: 24px;
	background: url(../i/osx_arrow_down.gif) no-repeat 0 -30px;

}
.osX a.jScrollArrowDown:hover {
	background-position: 0 0;
}
#logo img{
	margin: 0 20px 0 0;
}
#fl {
	float: left;
	width: 230px;
}
#fr {
	float: right;
	width: 130px;
}
/*--------------------------------------------------- Hover Links */
#pane2 ul {
	margin:0px;
	padding:0px;
}

#pane2 li{
	padding:0px;
	margin:0 0 15px 0;
	list-style: none;
	background-repeat: no-repeat;
}

#pane2 a {display:block; height:0; padding-top:88px; color:#000; overflow:hidden;}


/*--------------------------------------------------- Architecture Page */

#pane2 li.starsan	{width:103px;}
#pane2 li.gordontown	{width:103px;}
#pane2 li.techvillage	{width:103px;}
#pane2 li.oceanseleven	{width:103px;}
#pane2 li.jackshill	{width:103px;}
#pane2 li.nmia	{width:103px;}
#pane2 li.falmouth	{width:103px;}
#pane2 li.gordontownlibrary	{width:103px;}
#pane2 li.nif	{width:103px;}
#pane2 li.cherrygardens	{width:103px;}
#pane2 li.canteen	{width:103px;}

#pane2 a#starsan	{background: url(../i/starsan.jpg) 0px 0px;}
#pane2 a#gordontown	{background: url(../i/gordontown.jpg) 0px 0px;}
#pane2 a#techvillage	{background: url(../i/techvillage.jpg) 0px 0px;}
#pane2 a#oceanseleven	{background: url(../i/oceanseleven.jpg) 0px 0px;}
#pane2 a#jackshill	{background: url(../i/jackshill.jpg) 0px 0px;}
#pane2 a#nmia	{background: url(../i/nmia.jpg) 0px 0px;}
#pane2 a#falmouth	{background: url(../i/falmouth.jpg) 0px 0px;}
#pane2 a#gordontownlibrary	{background: url(../i/gordontownlibrary.jpg) 0px 0px;}
#pane2 a#nif	{background: url(../i/nif.jpg) 0px 0px;}
#pane2 a#cherrygardens	{background: url(../i/cherrygardens.jpg) 0px 0px;}
#pane2 a#canteen	{background: url(../i/canteen.jpg) 0px 0px;}

#pane2 a#starsan:hover	{background: url(../i/starsan.jpg) 0px -87px;}
#pane2 a#gordontown:hover	{background: url(../i/gordontown.jpg) 0px -87px ;}
#pane2 a#techvillage:hover	{background: url(../i/techvillage.jpg) 0px -87px;}
#pane2 a#oceanseleven:hover	{background: url(../i/oceanseleven.jpg) 0px -87px;}
#pane2 a#jackshill:hover	{background: url(../i/jackshill.jpg) 0px -87px ;}
#pane2 a#nmia:hover	{background: url(../i/nmia.jpg) 0px -87px;}
#pane2 a#falmouth:hover	{background: url(../i/falmouth.jpg) 0px -87px;}
#pane2 a#gordontownlibrary:hover	{background: url(../i/gordontownlibrary.jpg) 0px -87px;}
#pane2 a#nif:hover	{background: url(../i/nif.jpg) 0px -87px ;}
#pane2 a#cherrygardens:hover	{background: url(../i/cherrygardens.jpg) 0px -87px;}
#pane2 a#canteen:hover	{background: url(../i/canteen.jpg) 0px -87px;}


/*--------------------------------------------------- Planning Page */

#pane2 li.seventhharbour	{width:103px;}
#pane2 li.stannresort	{width:103px;}
#pane2 li.harmonycove	{width:103px;}
#pane2 li.elements-health-resort	{width:103px;}
#pane2 li.jrv	{width:103px;}
#pane2 li.oma	{width:103px;}

#pane2 a#seventhharbour	{background: url(../i/seventhharbour.jpg) 0px 0px;}
#pane2 a#stannresort	{background: url(../i/stannresort.jpg) 0px 0px;}
#pane2 a#harmonycove	{background: url(../i/harmonycove.jpg) 0px 0px;}
#pane2 a#elements-health-resort	{background: url(../i/elements-health.jpg) 0px 0px;}
#pane2 a#jrv	{background: url(../i/jrv.jpg) 0px 0px;}
#pane2 a#oma	{background: url(../i/oma.jpg) 0px 0px;}

#pane2 a#seventhharbour:hover	{background: url(../i/seventhharbour.jpg) 0px -87px;}
#pane2 a#stannresort:hover	{background: url(../i/stannresort.jpg) 0px -87px ;}
#pane2 a#harmonycove:hover	{background: url(../i/harmonycove.jpg) 0px -87px;}
#pane2 a#elements-health-resort:hover	{background: url(../i/elements-health.jpg) 0px -87px;}
#pane2 a#jrv:hover	{background: url(../i/jrv.jpg) 0px -87px ;}
#pane2 a#oma:hover	{background: url(../i/oma.jpg) 0px -87px;}

/*--------------------------------------------------- Interior Page */

#pane2 li.law	{width:103px;}
#pane2 li.ribkage	{width:103px;}
#pane2 li.phasethree	{width:103px;}
#pane2 li.gingiss	{width:103px;}
#pane2 li.gleaner	{width:103px;}
#pane2 li.bent	{width:103px;}

#pane2 a#law	{background: url(../i/lawoffice.jpg) 0px 0px;}
#pane2 a#ribkage	{background: url(../i/ribkage.jpg) 0px 0px;}
#pane2 a#phasethree	{background: url(../i/phasethree.jpg) 0px 0px;}
#pane2 a#gingiss	{background: url(../i/gingiss.jpg) 0px 0px;}
#pane2 a#gleaner	{background: url(../i/gleaner.jpg) 0px 0px;}
#pane2 a#bent	{background: url(../i/bent.jpg) 0px 0px;}

#pane2 a#law:hover	{background: url(../i/lawoffice.jpg) 0px -87px;}
#pane2 a#ribkage:hover	{background: url(../i/ribkage.jpg) 0px -87px ;}
#pane2 a#phasethree:hover	{background: url(../i/phasethree.jpg) 0px -87px;}
#pane2 a#gingiss:hover	{background: url(../i/gingiss.jpg) 0px -87px;}
#pane2 a#gleaner:hover	{background: url(../i/gleaner.jpg) 0px -87px ;}
#pane2 a#bent:hover	{background: url(../i/bent.jpg) 0px -87px;}

/*--------------------------------------------------- Real Estate Development Page */

#pane2 li.montrose	{width:103px;}
#pane2 li.stilwell	{width:103px;}

#pane2 a#montrose	{background: url(../i/montrose.jpg) 0px 0px;}
#pane2 a#stilwell	{background: url(../i/stilwell.jpg) 0px 0px;}

#pane2 a#montrose:hover	{background: url(../i/montrose.jpg) 0px -87px;}
#pane2 a#stilwell:hover	{background: url(../i/stilwell.jpg) 0px -87px ;}