@import url('libs/base.css');
@import url('libs/type.css'); /* Set Overall Font Styles, No Color */
@import url('libs/color.css'); /* Overall Colors */
@import url('libs/forms.css');
@import url('libs/superfish.css'); /* Superfish Essential Styles Remove if not being used */
@import url('libs/nivo-slider.css');
/* @import url('libs/debug.css'); Uncomment to make errors visible in a browser */
/* =============================================================================
   Primary styles
   Author:
   ========================================================================== */

/* When coding for a responsive web, quarantine layout rules line by line by adding media-queries directly after each rule. Then consolodate to media queries at the bottom. Using only relative units. */

/* ROOT */
body {background: #242424 url(../img/bg-body.png) 0 0 repeat-x; }
#container {background-color: #000; margin: 25px auto 0; width: 960px;}
div[role="main"], footer[role="contentinfo"] {width: 910px; margin: 0 auto;}
header[role="banner"] {width:960px; margin: 0 auto;}


/* Set Main Content Heading Styles Here */
div[role="main"] h1 {font-size: 2em; text-align: left;}

/* BANNER */
header[role="banner"] { position: relative; height: 180px;}

#secondary-nav { position: absolute; right: 0; top: 10px; }
#secondary-nav li { float: left; }
#secondary-nav a { color: #fff; border-left: 1px solid #fff; margin-left: .5em; padding-left: .5em; }
#secondary-nav a:hover {color: #000; }
#secondary-nav li:first-child a { border-width: 0px; }

/* Branding */
#branding { width: 250px; height: 159px; position: absolute; left: 5px; top: 10px; margin: 0; }
#branding a { width: 250px; height: 159px; background: url(../img/logo.png) 0 0 no-repeat;}

/* NAVIGATIONS */
nav li {list-style: none;}

/* Main Navigation */
nav[role="navigation"] { position: relative; top: 130px; }

/* Social Nav */
#social-nav {position: absolute; right:450px; top: 40px; height: 32px;}
#social-nav * {margin: 0; padding: 0;}
#social-nav li {float: left; margin: 0 3px;clear:both;}
#social-nav li a {width: 142px; height: 32px;}
.addr {position:absolute;right:15px;text-align:right;}
.addr2 {position:absolute;right:230px;text-align:right;}
#facebook {background: transparent url(../img/icn-facebook.png) no-repeat;}
#contactus {background: transparent url(../img/icn-contact.png) no-repeat;margin-top: 10px;width:157px!important;height:22px!important;}

/* Secondary Navigations */

/* Feature */
#feature {padding: 0; margin-top: 16px; margin-bottom: 2em;}
#gallery {margin: 0; padding: 10px 0 0 0;}
#gallery h2 {text-align: center; background-color: #000; color: #fff; margin-top: 10px; font-family: "Black Jack", Verdana, Arial, Helvetica, sans-serif;}
#gallery li {position: relative; float: left; list-style: none; text-align: left; margin: 0 8px; padding: 0 10px;background-color: #fff;}
#gallery li:hover { background-color: #a2a2a2;}
.caption p {padding:10px;font-size:1.1em;font-weight:bold;}
.caption span {position: relative; left: 10px; bottom: 10px;}
#gallery li:hover, #gallery li:hover .caption { background-color:  #a2a2a2; color: #000;}
#gallery li:hover h2 { background-color: #fff; color: #000; }
#gallery h2 a {color:#fff;display:block;padding:10px 0;}
#gallery li:hover h2 a {color:#000;}
.caption {overflow: hidden; position: absolute; bottom: 3px; left: 10px; display: none; background-color:  #fff; color: #000; height: 210px;}/* Set to the height of the image */

/* Slideshow */
#slideshow { overflow: hidden; }

/* MAIN */
div[role="main"] {  }

.portal-btn {
  float:left;width:45%;background:#fff;color:#000!important;padding:10px 5px;text-align: center;font-weight: bold;text-decoration: underline;
}


/* Content */
#content {text-align: left;}
.two-column #content { width: 58.24%; float: left; }
.community-page  #content div.left { width: 48%; }
.community-page  #content div.right { width: 48%; }
.community-page h4 {margin:0.65em 0;}
.community-page #content li a,.rentals #content li,.rentals table.apartments,.about #content ul li,.vcard {font-size:1.18em;line-height:1.5em}
.rental-description { width: 415px; float: left; background-color: #444; padding: 10px; margin: 0 0 1em; }
.rental-details { width: 415px; float: right; }
.rental-details td { padding: 4px; }
.rental-details tr:nth-child(odd) { background-color: #444444; }
.oldie .rental-details tr.odd { background-color: #444444; }
.rental-photos { clear: both; width: 100%; display: block; }
.rental-photos img { display: inline; padding: 4px; margin: 4px; border: 2px solid #444; }

.rental-listings li { float: left; margin: 0 12px;  }
.rental-listings li img { padding: 4px; margin: 4px; border: 2px solid #444; }
.rental-listings li p { margin-left: 8px;}

.rental-listings li a { text-decoration: underline; }

.rentals section {margin-bottom:25px;}
.rentals section h3 {margin:0;}
.rentals section h4 {margin:0.75em 0;}

.about .bullets {list-style-type:disc;}

/* Complementary Content */
.two-column div[role="complementary"] {width: 35.49%; float: right; margin-right: 9px;}
div[role="complementary"] h3 {font-size: 1.8em;font-family: "Black Jack", "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans serif; color: rgb(255,255,255);}

.apply-now {}
.apply-now a {padding: 8px 8px; color: #fff; display: block; background-color: #a2a2a2; }
.apply-now:hover a { color: #000; background-color: #fff; }

/* Property Programming */
.property .image {float:left;width:45%;}
.property .image img {padding:4px;border:2px solid #444;}
.property .largeimgcaption {text-align:center;}
.property .description {float:left;width:52%;}
.property .address {float:left;clear:both;}
.property .support {float:left;clear:both;margin-top:20px;}
.property .property-details {width:910px;float:left;}
.property tr:nth-child(odd) { background-color: #444444; }
.oldie .property .property-details tr.odd { background-color: #444444; }
.property .property-details td {width:25%;padding:4px;}
.property .features {margin-top:20px;clear:both;float:left;width:910px;display:block;}
.property #scroller img {height:134px;margin-right:10px;cursor:pointer;padding:4px;border:2px solid #444;}
.property #scroller { clear: both; width: 100%; display: block; margin-top:10px;}
.property .additional-photos {clear:both;}
.property .additional-photos img {float:left;}
.property #listingpicscroll { width:877px; height:185px; overflow:scroll; overflow-y: hidden; }
.property .links {float:left;width:50%;background:#444444;padding:10px;}
.property .links span {display:block;float:left;text-align:center;}
.property .links .three span {width:33%;}
.property .links .two span {width:50%;}
.property .apply-now {float:left;clear:right;width:475px;text-align:center;font-family:"Black Jack";margin-top:10px;}
.ie7 .property .apply-now {float:none;}
.property .apply-now a {padding:10px;}

#regform {margin:0 auto;text-align:center;}
#regform label {width:150px;text-align:left;}
#regform #state {width:144px;padding:1px 0;margin:0;}
.oldie #regform #state {width:166px;}

.saved {width:200px;float:left;text-align:center;}
.saved img {height:100px;margin-right:10px;cursor:pointer;padding:4px;border:2px solid #444;}
table.apartments {width:900px;}
.apartments {text-align: center;}
.apartments tr td {padding-top:20px;}
.apartments img {border:2px solid #444;padding:4px;}

.app #content a {text-decoration:underline;}
.app #content a:hover {text-decoration:none;}
.app h3.btn {margin-top:55px;}

/* CONTENTINFO */
footer[role="contentinfo"] { text-align: left; position: relative; min-height: 45px; height: 90%;  }
footer[role="contentinfo"] * { margin: 0; }
footer[role="contentinfo"] .wrapper { background-color: #000; margin: 0 auto; width: 98%; height: 90%; position: relative; }
footer[role="contentinfo"] a { color: #fff; text-decoration: none; text-align: center;}
footer[role="contentinfo"] a:hover {color: #ccc;}
.spider {background: url(../img/spiders.png) center top; background-repeat: no-repeat; height: 10px; display:block; text-transform:uppercase; font-size:10px; padding: 40px 0 0 0; text-decoration: none; width: 100px; margin-right: 10px; position: absolute; right: 15px; top: 10px; }
.spider:hover {background-position: center -50px; }
a[href="#container"] {position: absolute; left: 15px; top: 45px; text-align: left; }
#copyright { width: 260px; text-align: left; position: absolute; top: 20px; left: 15px; color: #fff; }
.equalhousing {position:relative;left:280px;top:20px;}
/* Microformats*/
#content .vcard {margin-bottom: 1em;}

/* Google Maps */
#googlemap { width: 75%; height: 300px; margin: 0 auto 1em;border:2px double #ddd; color:#000;}


/* =============================================================================
   Non-semantic helper classes
   Please define your styles before this section.
   ========================================================================== */

/* Sticky Footer - http://www.cssstickyfooter.com/using-sticky-footer-code.html */
html, body {height: 100%;}
#container {min-height: 95%;}
div[role="main"] {overflow: hidden; padding-bottom: 80px;}  /* must be same height as the footer */
footer[role="contentinfo"] {position: relative;	margin-top: -80px; /* negative value of footer height */ height: 80px; clear:both; }
.oldie footer[role="contentinfo"]  { margin-top: -70px; }
/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* TWG Specific */
.sm10 {font-size:10px;}
.hide {display:none;}
.shhhh {display:none;}
.cursor {cursor:pointer;}
.pad5 {padding:5px;}
.left {float:left;}
.tleft {text-align:left;}
.right {float:right;}
.tright {text-align:right;}
.center {text-align:center;}
.centeralign {text-align:center; margin:0 auto;}
.clear {clear:both;}
.clright {clear:right;}
.clleft {clear:left;}

/* =============================================================================
   Print styles.
   Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}