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

html, body
{
	height: 90%;
}

a img, img
{
	margin: 0; padding: 0;
	border: none;
}

body
{
	font: 90% Arial, Helvetica, sans-serif;
	color: #333;
	
	margin: 0;
	padding: 0;
	
	height: 100%;
	min-height: 100%;
	
	background: #999;
}

#container
{
	width: 1024px;
	height: 620px; /* added to stop movement at the bottom of the page during transitions */
	margin: 0 auto;
	
	background: #FFF;
	
	margin-top: 40px;
	
	border-right: 2px solid #777;
	border-bottom: 2px solid #777;
}

a
{
	color: #333;
	text-decoration: none;
}

a:hover
{
	color: #C41300;
}

#header
{
	height: 180px;
}

#header #logo
{
	float: left;
	
	margin-left: 42px;
	margin-top: 26px;
}

#header #logo a img
{
	border: none;
}


#header #nav
{
	float: right;
	margin-top: 46px;
	margin-right: 20px;
}

/*

#header #nav ul
{
	list-style-type: none;
	margin: 0; padding: 0;
}

#header #nav ul li
{
	display: block;
	float: left;
}

#header #nav ul li a
{
	padding: 12px;
}

*/

#container #content
{
	height: 318px;
	
	background: #f3f3f2;
	
	padding-right: 46px;
	
	/* overflow: hidden; */
	
	position: relative;
}

#container #content #staff
{
	position: absolute;
	
	top: -33px;
	right: 84px;
	
	overflow: hidden;
}

#container #footer
{
	text-align: right;
	
	clear: both;
	
	padding: 60px 20px 25px 20px;
}

#container #footer span.small
{
	font-size: 11px;
	
	/* padding: 70px 20px 25px 20px; */
	
	background: #FFF;
	color: #666;
}

#container #footer #footer-nav
{
	position: relative;
	z-index: 1;
}

#container #footer a
{
	padding: 6px;
	text-decoration: none;
}

#container #content #left-column, #container #content #right-column
{
	float: left;
}

#container #content #right-column
{
	margin-left: 70px;
}

/* reset margins and padding for heading elements in the write-up */

h2, h3, h4, p.heading
{
	margin: 0; padding: 0;
}

h2, h4, p.heading
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
}

h4
{
	font-size: 12px;
	color: #999;
}

#container #content p.heading span
{
	font-family: Minion Pro, Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
}

#container #content #write-up h3
{
	font-size: 16px;
	font-weight: normal;
}

#container #content .control a
{
	height: 100%;
	width: 21px;
	
	display: block;
	
	text-indent: -999px;
	overflow: hidden;
}

* html #container #content .control a
{

}

#container #content .control.left a
{
	background: no-repeat center url( '../images/control-left.gif' );
}

#container #content .control.right a
{
	background: no-repeat center url( '../images/control-right.gif' );
}

* html #container #content .control.right.hide a
{
	display: none;
}

#container #content .control, #container #content #write-up
{
	float: left;
	height: 300px;
}

#container #content #write-up
{
	margin: 20px 34px 0px 34px;
	width: 400px;
	
	font-family: Minion Pro, Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	
	line-height: 26px;
}

* html #container #content #write-up
{
	margin: auto;
}

#container #content #write-up.wide
{
	width: 600px;
	margin-left: 120px;
}

#container #content #write-up h2
{

}

/* staff page styles */

#container #content.staff #left-column
{
	position: relative;
}

#container #content.staff #left-column #write-up, #container #content.staff #left-column #team
{
	float: left;
}

#container #content.staff #left-column #write-up
{
	width: 160px;
	margin-left: 78px;
	margin-right: 680px;
}

* html .staff-holder #write-up
{
	position: absolute;
	
	top: 0;
	left: 0;
}

#container #content.staff #left-column #team
{
	position: absolute;
	top: -33px;
	left: 180px;
}

#container #content.staff #left-column #team img
{
	float: left;
}

#container #content.staff
{
	padding-left: 20px;
	padding-right: 20px;
}

#container #content.staff #left-column .staff-holder
{
	width: 938px;
	float: left;
}

/* staff individual */

#container #content.staff #left-column .staff-holder #staff-individual
{
	position: absolute;
	top: -33px;
	left: 0px;
	
	margin: 0 20px;
}

#container #content.staff #left-column .staff-holder #quick-links
{
	position: absolute;
	top: 250px;
	left: 200px;
	
	width: 80px;
	height: 12px;
}

#container #content.staff #left-column .staff-holder #staff-individual, #container #content.staff #left-column .staff-holder #individual-write-up
{
	float: left;
}

* html #container #content.staff #left-column .staff-holder #individual-write-up
{
	position: absolute;
}

/* property cycle */

#left-column .property-cycle
{
	width: 391px;
	height: 318px;
	overflow: hidden;
}

#left-column .property-thumbnails
{
	width: 420px;
	height: 318px;
	overflow: hidden;
	
	/* background: #C41300; */
}

#left-column .property-thumbnails img
{
	height: 100px;
	width: 100px;
	margin: 0; padding: 4px 0 0 4px;
	
	display: block; float: left;
}

/* jScroll */

/* Stylesheet for my demo pages for jScrollPane - these styles aren't necessary for using jScrollPane and aren't specific to any particular example */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
}

a.jScrollArrowUp {
	background: url(../images/arrow_up.gif) repeat-x 0 0;
}
a.jScrollArrowUp:hover {
	/* background-position: 0 -15px; */
}
a.jScrollArrowDown {
	background: url(../images/arrow_down.gif) repeat-x 0 0;
}
a.jScrollArrowDown:hover {
	/* background-position: 0 -15px; */
}

/*
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	background-position: 0 -30px;
}
*/


.orange-bar .jScrollPaneTrack {
	background: #f60;
}
.orange-bar .jScrollPaneDrag {
	background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%;
}
.orange-bar .scroll-pane {
	background: #69f;
}
			
.holder {
	float: left;
	margin: 10px;
}

.scroll-pane {
	width: 600px;
	height: 200px;
	overflow: auto;
	/* background: #ccc; */
	float: left;
}

.wide {
	width: 400px;
}

.super-wide {
	width: 700px;
}

.tall {
	height: 400px;
}

#pane1 {
}
#pane2 {
	height: 150px;
}
#pane3 {
	height: 280px;
}
#pane4 {
	height: 190px;
}

#container #content.staff #left-column .staff-holder #individual-write-up
{
	width: 600px;
	height: 280px;
	
	font-family: Minion Pro, Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	line-height: 26px;
	
	margin-top: 20px;
	margin-left: 270px;
	
	overflow: hidden;
}

.scroll-pane
{
	width: 580px;
}

.wide
{
	width: 800px;
}

.short
{
	width: 480px;
}
		
/* menu styles */

#jsddm
{
	margin: 0;
	padding: 0;
}

#jsddm li
{
	float: left;
	list-style: none;
}

#jsddm li a
{
	display: block;
	/* background: #324143; */
	padding: 5px 12px 8px 12px;
	text-decoration: none;
	color: #333;
	white-space: nowrap
}

#jsddm li a:hover
{
	color: #C41300;
}
	
#jsddm li ul
{
	margin: 0;
	padding: 0;
	position: absolute;
	display: none;
	border-top: 1px solid white;
	
	z-index: 5000;
}
	
#jsddm li ul li
{
	float: none;
	display: inline
}
		
#jsddm li ul li a
{
	width: auto;
	color: #333;
	background: #F3F3F2;
	
	margin-bottom: 1px;
}
		
#jsddm li ul li a:hover
{
	color: #C41300;
	background: #E1E1E1;
}

/* lightbox */

a.thumbnail img
{
	width: 64px;
	height: 48px;
	
	border: 1px solid #DD9891;
	margin-top: 10px;
}

a.thumbnail:hover img
{
	border: 1px solid #BC3123;
}

span.small
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	display: block;
}

img.logo
{
	border: 1px solid #CCC;
}

#content a
{
	text-decoration: underline;
}

#content a:hover
{
	text-decoration: none;
}