/* == -------------------------GENERAL DEFAULTS ------------------------- == */
html, body {}
body {padding:0px; margin:0px; font:12px "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#333;}
#bg {background:url(images/pagebg.jpg) top center repeat-x  #FFF; height:100%; min-width:960px;}
img {border:0px;}
form {margin:0px;}
.right {float:right;}
.left {float:right;}
.cfl {clear:left; width:1px; height:1px;}
.cfr {clear:right; width:1px; height:1px;}
.cfb {clear:both; width:1px; height:1px;}
a {outline: none;}
a:link, a:visited {color:#3366FF;text-decoration:none;}
a:hover, a:active {text-decoration:underline;}
/* == -------------------------- PAGE/INTERFACE CONTAINERS------------------------- == */
#pagecontainer {width:960px; margin:0px auto;}
#container_bg {min-height:250px; background:url(images/container_bg.png) repeat-y; margin:0px;}
#container_bottom {clear:both; height:17px; overflow:hidden; background:url(images/container_bottom.png) no-repeat;}

/* == -------------------------- SECONDARY NAVIGATION (TOP)------------------------- == */
#topnav {height:20px; font-size:11px; padding:0px 10px;}
#topnav a {color:#fff;}
#topnav a:link,  #topnav a:visited {color:#fff; text-decoration:none;}
#topnav a:hover,  #topnav a:active {color:#fff; text-decoration:underline;}
#tnl {float:left; margin:4px 0px; padding:0px;}
#tnr {float:right; margin:4px 0px; padding:0px;}
#tnl li {display: inline; list-style-type: none; padding-right:20px;}
#tnr li {display: inline; list-style-type: none; padding-left: 20px;}

/* == -------------------------HEADER------------------------- == */
#header {width:960px; height:189px; overflow:hidden; background:url(images/header_bg.png) no-repeat; }
#headerbanner {margin:3px auto 0px auto; width:950px; height:186px; overflow:hidden; background-repeat:no-repeat; position:relative;}
#logo {position:absolute; left:22px; top:22px;}

/* == -------------------------- MAIN NAVIGATION ------------------------- == */
#nav {border:solid #fff; border-width:1px 1px 0px 1px; height:23px; margin:0px 5px;}
#nav ul{padding:0px; margin:0px; background-color:#fff; float: left; width: 100%;}
#nav ul li {display:block; height:22px; overflow:hidden; float:left; border-bottom: 1px solid #fff; }
#nav ul li a {display:block; height:22px; background-color: #036; color:#fff; text-decoration: none; float:left;  padding-top:50px; font-size:1px; background-image:url(images/mainnav.png); background-repeat:no-repeat;}

#navsectionA a {width:133px;}
#navsectionA a:link, #navsectionA a:visited {background-position:0px 0px;}
#navsectionA a:hover, #navsectionA a:active {background-position:0px -30px;}
#navsectionB a {width:131px;}
#navsectionB a:link, #navsectionB a:visited {background-position:-133px 0px;}
#navsectionB a:hover, #navsectionB a:active {background-position:-133px -30px;}
#navsectionC a {width:140px;}
#navsectionC a:link, #navsectionC a:visited {background-position:-264px 0px;}
#navsectionC a:hover, #navsectionC a:active {background-position:-264px -30px;}
#navsectionD a {width:158px;}
#navsectionD a:link, #navsectionD a:visited {background-position:-404px 0px;}
#navsectionD a:hover, #navsectionD a:active {background-position:-404px -30px;}
#navsectionE a {width:164px;}
#navsectionE a:link, #navsectionE a:visited {background-position:-562px 0px;}
#navsectionE a:hover, #navsectionE a:active {background-position:-562px -30px;}
#navsectionF a {width:222px;}
#navsectionF a:link, #navsectionF a:visited {background-position:-726px 0px;}
#navsectionF a:hover, #navsectionF a:active {background-position:-726px -30px;}

.sectionA #nav ul li#navsectionA, .sectionB #nav ul li#navsectionB, .sectionC #nav ul li#navsectionC, .sectionD #nav ul li#navsectionD,.sectionE #nav ul li#navsectionE,.sectionF #nav ul li#navsectionF{height:23px; border-bottom:0px solid #fff;}

#navsect {height:12px; overflow:hidden; background-repeat:repeat-x; margin:0px 6px; background-color:#fff;}

h1, h2 {display:inline}
/* == -------------------------SECTIONAL COLOUR SWITCHING ------------------------- == */
.home #navsect, #navsect  {background-image:url(images/navsect_home.gif);}
.sectionA #navsect {background-image:url(images/navsect_A.gif);}
.sectionB #navsect {background-image:url(images/navsect_B.gif);}
.sectionC #navsect {background-image:url(images/navsect_C.gif);}
.sectionD #navsect {background-image:url(images/navsect_D.gif);}
.sectionE #navsect {background-image:url(images/navsect_E.gif);}
.sectionF #navsect {background-image:url(images/navsect_F.gif);}

.sectionA h1,.sectionA h2, .sectionA .sectiontitle, .sectionA .subsectiontitle {color:#013D78;}
.sectionA h1,.sectionB h2, .sectionB .sectiontitle, .sectionB .subsectiontitle {color:#08526A;}
.sectionC h1,.sectionC h2, .sectionC .sectiontitle, .sectionC .subsectiontitle {color:#1E6C53;}
.sectionD h1,.sectionD h2, .sectionD .sectiontitle, .sectionD .subsectiontitle {color:#36893A;}
.sectionE h1,.sectionE h2, .sectionE .sectiontitle, .sectionE .subsectiontitle {color:#59B128;}
.sectionF h1,.sectionF h2, .sectionF .sectiontitle, .sectionF .subsectiontitle {color:#71CC1D;}
.sectionG h1,.sectionG h2, .sectionG .sectiontitle, .sectionG .subsectiontitle {color:#225AAC;}
h1, h2, .sectiontitle, .subsectiontitle {color:#225AAC;}

.sectionA #sectionnav ul li a {color:#013D78;}
.sectionB #sectionnav ul li a {color:#08526A;}
.sectionC #sectionnav ul li a {color:#1E6C53;}
.sectionD #sectionnav ul li a {color:#36893A;}
.sectionE #sectionnav ul li a {color:#59B128;}
.sectionF #sectionnav ul li a {color:#71CC1D;}
.sectionG #sectionnav ul li a {color:#225AAC;}
#sectionnav ul li a {color:#225AAC;}

/* == -------------------------SECTIONAL PAGES CONTENT------------------------- == */
#content_main {margin:10px 30px 0px 30px; background-color:#fff; border:1px solid #fff;}
h1, .sectiontitle {font-size:16px; font-weight:bold;}
h2, .subsectiontitle {font-size:16px;}


/* == -------------------------SECTIONAL FORMAT/NAV SWITCHES ------------------------- == */
#content_main {background:url(images/sectionnavbg.gif) repeat-y;}
/*.sectionA #content_main, .sectionF #content_main, .sectionG #content_main {background-image:none;}*/


#page_content {margin-left:240px; width:auto; border:1px solid #fff;}
/*
.sectionA #page_content, .sectionF #page_content, .sectionG #page_content {margin-left:0px;}
.sectionA #sectionnav, .sectionF #sectionnav, .sectionG #sectionnav  {display:none;}
*/

/* == -------------------------SECTIONAL PAGES SIDENAV------------------------- == */
#sectionnav {float:left; width:210px; margin-top:20px;}
#sectionnav ul {margin:10px 15px 10px 0px; padding:0px;}
#sectionnav ul li {list-style-type:none; margin:5px 0px; padding:0px;}
#sectionnav ul li a.current {font-weight:bold;}
#sectionnav ul ul {margin:0px 0px 10px 10px; padding:0px;}
#sectionnav ul ul li {margin:2px 0px; font-size:11px; display:block; padding-left:0px;}
#sectionnav ul ul ul {margin:0px 0px 0px 15px; padding:0px; }



/* == -------------------------FOOTER ------------------------- == */
#footer {height:24px; font-size:11px; color:#666; margin:0px auto 10px auto; padding:0px 5px; text-align:center;}
#footer ul {margin:0px; padding:0px;}
#footer li {display:inline; list-style-type: none; padding-right:8px;}
#footer a {padding:0px;}
#footer a:link, #footer a:visited {text-decoration:none; color:#3366FF;} 
#footer a:hover, #footer a:active {text-decoration:underline; color:#3366FF;} 

a#share, a#sendfriend {padding:5px 0px 5px 20px;}
a#share {background:url(images/footer_share.gif) 0px 4px  no-repeat;}
a#sendfriend {background:url(images/footer_sendfriend.gif) 0px 4px  no-repeat;}

/* == -------------------------HOMEPAGE ------------------------- == */

#content_home {margin:10px 30px; background-color:#fff; border:1px solid #fff;}

#home_overview {float:left; width:430px; padding-bottom:10px; margin-right:20px;}
#home_overview h1, #home_news h1 {margin:4px 0px; font-size:14px; font-weight:bold; color:#013D78;}
#home_news {float:left; width:430px;}
#home_news a {text-decoration:underline;}
#home_overview p, #home_news p {margin:0px 0px 10px 0px;}
#home_news h1 {color:#225AAC;}

#home_callouts_pics {clear:both; background:url(images/home_callouts_pics.jpg) no-repeat; width:912px; height:99px; overflow:hidden; margin:15px auto 0px auto;}
#home_callouts_content {font-size:12px; color:#fff; line-height:12px;background:url(images/home_callouts_bg.png) repeat-y ; width:912px; margin:0px auto;}
#home_callouts_content a:link, #home_callouts_content a:visited, #home_callouts_content a:hover, #home_callouts_content a:active {color:#fff; text-decoration:none;}

#home_callouts_content h1 {font-size:14px; margin:0px 0px 3px 0px; color:#fff; display:block;}
#hpc_tenants,#hpc_landlords,#hpc_condos,#hpc_co-ops {position:relative; float:left; width:190px;margin:5px 10px;}
#hpc_tenants {margin-right:30px; position:relative;}
#hpc_landlords {margin-right:30px; position:relative;}
#hpc_condos {margin-right:30px; position:relative;}
#hpc_co-ops {position:relative;}

#home_callouts_bottom {background:url(images/home_callouts_bottom.png) no-repeat; width:912px; height:8px; margin:0px auto; position:relative;}
#home_callouts_bottom a {position:absolute; display:block; width:14px; height:14px; overflow:hidden; background:url(images/hpclinks.gif) no-repeat; top:-12px; }
a#hpclinka {left: 200px;}
a#hpclinka:link, a#hpclinka:visited {background-position:0px 0px;}
a#hpclinka:hover, a#hpclinka:active {background-position:0px -40px;}
a#hpclinkb {left: 430px;}
a#hpclinkb:link, a#hpclinkb:visited {background-position:-40px 0px;}
a#hpclinkb:hover, a#hpclinkb:active {background-position:-40px -40px;}
a#hpclinkc {left: 660px;}
a#hpclinkc:link, a#hpclinkc:visited {background-position:-80px 0px;}
a#hpclinkc:hover, a#hpclinkc:active {background-position:-80px -40px;}
a#hpclinkd {left: 892px;}
a#hpclinkd:link, a#hpclinkd:visited {background-position:-120px 0px;}
a#hpclinkd:hover, a#hpclinkd:active {background-position:-120px -40px;}

/* == -------------------------DYNAMIC DETAIL BOXES ------------------------- == */
div.detailBox {margin-top:10px;border:1px solid green}
div.detailBox p{padding:5px 10px;}
div.detailBox h3 {font-size:12px; font-weight:normal; color:#225AAC; cursor:pointer;background:url(images/detailBox_open.gif) no-repeat 5px 50%; margin:0px; padding:3px 20px; border-bottom:1px solid #fff; background-color:#D3DEEE; color:#333;}
div.detailBox h3.open  {font-weight:bold; background:url(images/detailBox_close.gif) no-repeat  5px 50%; background-color:#225AAC; color:#fff;}
/* div.detailBox div, div.detailBox p  {padding:0px 5px 15px 20px;border:1px dashed green}   
this exists only to show editable region in backend editor;I can rig a temporary style if desired instead*/ 


.sectionA div.detailBox h3 {color:#333; background-color:#BFCEDD;}
.sectionA div.detailBox h3.open {color:#FFF; background-color:#346493;}
.sectionB div.detailBox h3 {color:#333; background-color:#C1D3D9;}
.sectionB div.detailBox h3.open {color:#FFF; background-color:#397588;}
.sectionC div.detailBox h3 {color:#333; background-color:#C7DAD4;}
.sectionC div.detailBox h3.open {color:#FFF; background-color:#4B8975;}
.sectionD div.detailBox h3 {color:#333; background-color:#CDE1CE;}
.sectionD div.detailBox h3.open {color:#FFF; background-color:#5EA161;}
.sectionE div.detailBox h3 {color:#333; background-color:#DEEFD4;}
.sectionE div.detailBox h3.open {color:#FFF; background-color:#7AC153;}
.sectionF div.detailBox h3 {color:#333; background-color:#E3F5D2;}
.sectionF div.detailBox h3.open {color:#FFF; background-color:#7FD133;}

#printHeader {display:none;}