/* styles.css by: Michael Fernandez http://www.paragon.com */ /*-------------------------------------------------------------------------------------- RESET, BASICS, and TOOLBOX ----------------------------------------------------------------------------------------*/ * { margin: 0; padding: 0; } body { background: url("../images/page_bg_repeat.jpg") repeat; font: 12px/1.8 "Geneva", Helvetica, Arial, Sans-Serif; color: #fff; } .clear { clear: both; } .hide { display: none; } a, a img { outline: none; border: none; } img { vertical-align: middle; } table { border-collapse: collapse; } /*-------------------------------------------------------------------------------------- TYPOGRAPHY ---------------------------------------------------------------------------------------*/ h1, h2, h3, h4, h5 { font: 24px Geneva, Serif; } /* h3, h4, h5 { margin: 0 0 15px 0; } */ h1 { text-indent: -9999px; overflow: hidden; } h2 { font-size: 28px; } h3 { font-size: 24px; } h4 { font-size: 20px; } h5 { font-size: 16px; } a, a:visited { outline: none; text-decoration: none; color: #073955; } a:hover, a:focus { text-decoration: underline; } ul, ol { list-style: none; } blockquote { font: italic 16px/1.8 Georgia, Serif; color: #999; padding: 0 0 0 20px; } blockquote p { } p { margin: 0 0 0; } p strong { font-weight: normal;} pre, tt { font-family: Courier, Monospace; } .button { background: #8c8e91 url(images/button-bg.jpg) repeat-x; padding: 4px 10px; -moz-border-radius: 8px; -webkit-border-radius: 8px; color: #073955; text-decoration: none; } .button:hover { background: #ccc; color: #222; text-decoration: none; } acronym, abbr { border-bottom: 1px dotted #999; cursor: help; } dl { margin: 0 0 15px 0; } dt { /*font-weight: bold;*/ } dd { margin: 0 10px 10px 10px; } .wl { background:#FFFFFF url("../images/wl.jpg") repeat-x; height: 1px; left:56px; position:relative; top:8px; width: 983px; } .gone { display: none; } /*-------------------------------------------------------------------------------------- BASE STRUCTURE ---------------------------------------------------------------------------------------*/ /*#bg_wrap { background: #342222 url("../images/bg_top.jpg") repeat-x; } */ #page_wrap { width: 1056px; margin: 0 auto; position: relative; } #main_content { position: relative; background: url(images/content-middle.jpg) repeat-y; } #main_content_bottom { height: 14px; background: url(images/content-bottom.jpg) no-repeat; } #main_content_inside { background: url(images/content-top.jpg) no-repeat; } #content { width: 590px; padding: 10px 15px; float: left; } #subcontent { margin-left: 56px; padding: 24px 80px; height: 92px; } #subcontent h2 { font-size: 22px; color: #000; text-indent: -9999px; overflow: hidden; margin-bottom: 2px; } body#index #subcontent h2 { background: url("../images/h2_index.png") no-repeat; } body#floorplans #subcontent h2 { background: url("../images/h2_floorplans.png") no-repeat; } body#amenities #subcontent h2 { background: url("../images/h2_amenities.png") no-repeat; } body#location #subcontent h2 { background: url("../images/h2_location.png") no-repeat; } body#gallery #subcontent h2 { background: url("../images/h2_gallery.png") no-repeat; } body#contact #subcontent h2 { background: url("../images/h2_index.png") no-repeat; } body#index #subcontent p , body#contact #subcontent p { line-height: 20px; width: 100%; text-align: justify; font-size: 14px; color:#fff;} #subcontent p { line-height: 20px; width: 103%; text-align: justify; /* color:#000; */ font-size: 14px; } body#index #subcontent { background: #840d0d url("../images/subcontent_bg_index.jpg") repeat-x; width: 824px; padding-bottom: 45px; } body#floorplans #subcontent { background: #93a445 url("../images/subcontent_bg_floorplans.jpg") repeat-x; width: 824px; } body#amenities #subcontent { background: #d99240 url("../images/subcontent_bg_amenities.jpg") repeat-x; width: 824px; height: 100px; padding-bottom: 36px; } body#location #subcontent { background: #b2700f url("../images/subcontent_bg_location.jpg") repeat-x; width: 824px; height: 100px; padding-bottom: 36px; } body#gallery #subcontent { background: #498684 url("../images/subcontent_bg_gallery.jpg") repeat-x; width: 824px; padding-bottom: 25px; } body#contact #subcontent { background: #840d0d url("../images/subcontent_bg_contact.jpg") repeat-x; width: 824px; } /*-------------------------------------------------------------------------------------- MASTHEAD & HEADER ---------------------------------------------------------------------------------------*/ #header { width: 996px; height: 440px; position: relative; float: right; top: 11px; right: 3px; } body#index #header { height: 438px; position: relative; top: 4px; right: -14px; } #logo { background: url("../images/branding.png") no-repeat; position: absolute; top: 18px; left: 55px; width: 360px; height: 56px; } #logo a { display: block; width: 360px; height: 56px; text-indent: -9999px; } #call_today { float:right; font-size:16px; font-weight:normal; position:absolute; right:14px; text-transform: uppercase; top:18px; } #flashContent { position: relative; left:-2px; } .main_image { width: 679px; height: 370px; overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/ } /*-------------------------------------------------------------------------------------- NAVIGATION ---------------------------------------------------------------------------------------*/ #top_menu { padding-top: 10px; position: absolute; top: 49px; right: -7px; height: 43px; } #top_menu li { float: left; padding-right: 21px; } #top_menu a { background: url("../images/top_menu.png") no-repeat; display: block; width: 29px; height: 40px; overflow: hidden; text-indent: -9999px; position: relative; } #main_menu { position: absolute; top: 29px; left: 16px; z-index: 5; } #main_menu a { background: url("../images/main_menu.png") no-repeat; display: block; width: 103px; height: 78px; overflow: hidden; text-indent: -9999px; } #top_menu li a.pdf { background-position: 0px 3px; } #top_menu li a:hover.pdf { background-position: 0px -1px; } #top_menu li a.walkscore { background-position: -51px 3px; } #top_menu a:hover.walkscore { background-position: -51px -1px; } #top_menu a.facebook { background-position: -100px 3px; } #top_menu a:hover.facebook { background-position: -100px -2px; } #top_menu a.twitter { background-position: -151px 3px; } #top_menu a:hover.twitter { background-position: -151px -1px } /*------------------------------------------------------------------------ HOVER STATES MAIN MENU --------------------------------------------------------------------------*/ #main_menu li a.floorplans { background-position: 0px 0px; } #main_menu li a:hover.floorplans { background-position: -103px 0px; } #main_menu li a.amenities { background-position: 0px -70px; } #main_menu a:hover.amenities { background-position: -103px -70px; } #main_menu a.location { background-position:0px -146px; } #main_menu a:hover.location { background-position: -103px -146px; } #main_menu a.gallery { background-position:0px -221px; } #main_menu a:hover.gallery { background-position: -103px -221px; } #main_menu li a.lease { background-position:0px -300px; height: 25px; } #main_menu li a:hover.lease { background-position: -103px -300px; } #main_menu li a.contact { background-position:0px -325px;height: 30px;} #main_menu li a:hover.contact { background-position: -103px -325px; } #main_menu li a.retail { background-position:0px -355px; height: 30px;} #main_menu li a:hover.retail { background-position: -103px -355px; } /*------------------------------------------------------------------------ ACTIVE STATES MAIN MENU --------------------------------------------------------------------------*/ body#floorplans #main_menu li a.floorplans { background-position: -103px 0px; } body#amenities #main_menu li a.amenities { background-position: -103px -70px; } body#location #main_menu li a.location { background-position: -103px -146px; } body#gallery #main_menu li a.gallery { background-position: -103px -221px; } body#contact #main_menu li a.contact { background-position: -103px -325px; } /*-------------------------------------------------------------------------------------- MAIN CONTENT ---------------------------------------------------------------------------------------*/ #content_container { background: url("../images/content_container.png") no-repeat 45px -4px; top: 88px; position: relative; } body#index #content_container { background: url("../images/content_container.png") no-repeat 47px -11px; top: 95px; position: relative; width: 1039px; } .content a { padding: 1px 4px; background: #c8f3ff; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .content a img { margin: 0 -4px; } .content a:hover { text-decoration: none; background: #6ec0d7; } .postThumb { width: 150px; height: 150px; overflow: hidden; position: absolute; top: 0; right: 0; border: 2px solid #42331a; } .spacer { width: 160px; float: right; height: 100px; } .undertitle { position: absolute; top: 100%; left: 0; } .meta { color: #c94a29; margin: 3px 0 10px 0; } .meta span { font-family: Georgia, Serif; font-style: italic; } .post ul { list-style: disc; margin: 0 0 15px 30px; } .post ol { list-style: decimal; margin: 0 0 15px 30px; } pre { background: #eee; padding: 10px; border: 2px solid #c94a29; overflow: hidden; margin: 0 0 15px 0; width: 563px; } .split-left { width: 48%; float: left; } .split-right { width: 48%; float: right; } /*-------------------------------------------------------------------------------------- SIDEBAR ---------------------------------------------------------------------------------------*/ #sidebar { position: absolute; top: 40px; width: 181px; left: 820px; padding: 15px; height: 330px; } body#location #sidebar { position: absolute; top: 40px; width: 181px; left: 820px; padding: 15px; height: 356px; overflow: hidden; } body#floorplans #sidebar { background-color: #e1d3a4; position: absolute; top: 40px; width: 181px; left: 820px; padding: 15px; height: 330px; } #sidebar h4 { margin: 0 0 5px 0; } #sidebar ul { } #sidebar li { padding: 2px 6px; margin: 0 0 1px 0; } #sidebar li a { display: block; } /*-------------------------------------------------------------------------------------- FOOTER ---------------------------------------------------------------------------------------*/ #footer { padding: 22px 55px; font-size: 16px; position:relative; } #footer p span { text-transform: uppercase; } #affiliates { position: absolute; top: 20px; right: 16px; }