/* ============================================================================================== HTML ---- ============================================================================================== */ html { overflow-y: scroll; /* Forces a non-scrolling scroll bar on all pages so that we don't have left-right jumps when browsing around pages with different heights */ } /* ============================================================================================== Body ---- ============================================================================================== */ body { padding: 0; margin: 0; background-color: #0D0D0E; background-image: url('/shared/body/images/bg_body.jpg'); background-repeat: repeat-x; font-family: "Trebuchet MS", helvetica, arial, sans-serif; text-align: center; } /* ============================================================================================== Shadow --------- Area behind container that has bg_container.png as background. bg_container.png has shadows on left and right sides and light/cream color in middle. The light/cream color makes up the background for the container (below). Note: At this point, a horizontal scroll bar will show up at 948px (width of the container). If we want the scroll bar to show up at 972px (width of the container plus the 12px border on each side), we would need an "outerWrapper" for the container with a wdith specified at 972px; ============================================================================================== */ #shadow { /* width: 1016px; */ /* if specified, shadow will cause horizontal scroll bar on low resolution screens */ margin: 0 auto; /* auto for left and right centers contents */ text-align: center; background-image: url("/shared/container/images/bg_container.png"); /* Contains cream color background */ background-color: transparent; background-repeat: repeat-y; background-position: center; color: white; } /* ============================================================================================== Container --------- Area of acutal content 948px wide; A horizontal scroll bar will show up for a viewer smaller than 948px; ============================================================================================== */ #container { width: 948px; margin: 0 auto; text-align: left; padding: 8px 0 50px 0; } /* ============================================================================================== Header ------ White area w/ 1px border that holds logo, menu, and Energy Star Logo. ============================================================================================== */ #header { margin-bottom: 12px; padding: 0px; height: 57px; border: 1px solid black; background-color: white; } #header img { border: 0; } /* ============================================================================================== MENU ---- This copyright notice must be kept untouched in the stylesheet at all times. The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/menus/pro_drop.html Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. This stylesheet and the associated (x)html may be modified in any way to fit your requirements. ============================================================================================== */ #multi-level {height:57px; position:relative; z-index:100;} #multi-level .pad {float:left;} /* The menu styling */ /* Remove the padding, margins and bullets from the lists */ .menu, .menu ul {list-style-type:none; padding:0; margin:0; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;} /* Set up the top level list items and float left to place inline */ .menu li.top {display:block; float:left; position:relative;} /* Style and position the table so it takes no part in the menu function. The font size is necessary for IE5.5 */ .menu table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;} /* Default top link link styling */ .menu li.top a.top_link {display:block; float:left; height:57px;} .menu li.top a span {position:absolute; left:-9999px; top:0; z-index:0; font-size:10px;} /* move the link text off screen */ /* pre-load the hover images into the lists */ .menu li.p1 {width:86px; background:url("../shared/menu/images/homes_1.png") no-repeat;;} .menu li.p2 {width:136px; background:url("../shared/menu/images/communities_1.png") no-repeat;;} .menu li.p3 {width:97px; background:url("../shared/menu/images/features_1.png") no-repeat;;} .menu li.p4 {width:108px; background:url("../shared/menu/images/company_1.png") no-repeat;;} /* set up the normal unhovered images in the links */ .menu li a#homes {width:86px; background:url("../shared/menu/images/homes_0.png") no-repeat;} .menu li a#communities {width:136px; background:url("../shared/menu/images/communities_0.png") no-repeat;} .menu li a#features {width:97px; background:url("../shared/menu/images/features_0.png") no-repeat;} .menu li a#company {width:108px; background:url("../shared/menu/images/company_0.png") no-repeat;} /* Style the list OR link hover. Depends on which browser is used */ .menu a:hover {visibility:visible;} /* for IE6 */ .menu li:hover { position:relative; z-index:200;} /* for IE7 */ /* make the links transparent on hover so that the hover images in the lists show through (no flicker) */ .menu li a#homes:hover, .menu li:hover a#homes, .menu li a#communities:hover, .menu li:hover a#communities, .menu li a#features:hover, .menu li:hover a#features, .menu li a#company:hover, .menu li:hover a#company {background:transparent;} /* keep the 'next' level invisible by placing it off screen. */ .menu ul, .menu :hover ul ul, .menu :hover ul :hover ul ul, .menu :hover ul :hover ul :hover ul ul, .menu :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0;} /* set up the first drop down sub level */ .menu :hover ul.sub {left:0; top:57px; background: #fff; padding:0px 0; border:3px solid #474747; white-space:nowrap; width:155px; height:auto;} /* top is where the drop down menu starts; border is border width around drop down; width is the width of the drop down */ .menu :hover ul.sub li {display:block; height:28px; position:relative; float:left; width:155px;} .menu :hover ul.sub li a {display:block; font-size:12px; font-variant: normal; font-weight: 400; height:28px; width:155px; line-height:28px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 0px;} .menu :hover ul.sub li a.fly {background:#fff url("../shared/menu/images/arrow.gif") 140px 7px no-repeat;} .menu :hover ul.sub li a:hover {background:#ccc; color:#000;} /* Background & Text Color of menu items that don't have a fly out */ .menu :hover ul.sub li a.fly:hover {background:#ccc url("../shared/menu/images/arrow_over.gif") 140px 7px no-repeat; color:#000;} /* Background & Text Color of menu items that HAVE a fly out */ .menu :hover ul li:hover > a.fly {background:#ccc url("../shared/menu/images/arrow_over.gif") 140px 7px no-repeat; color:#000;} /* Background & Text Color of menu items AFTER the fly out */ .menu :hover ul.sub li.warranties a.fly {background:#fff url("../shared/menu/images/arrow_left.gif") 140px 7px no-repeat;} .menu :hover ul.sub li.warranties a.fly:hover {background:#ccc url("../shared/menu/images/arrow_left.gif") 140px 7px no-repeat; color:#000;} /* Background & Text Color of menu items that HAVE a fly out */ .menu :hover ul li.warranties:hover > a.fly {background:#ccc url("../shared/menu/images/arrow_left.gif") 140px 7px no-repeat; color:#000;} /* Background & Text Color of menu items AFTER they fly out */ /* set up the flyout levels when hovering */ .menu :hover ul :hover ul, .menu :hover ul :hover ul :hover ul, .menu :hover ul :hover ul :hover ul :hover ul, .menu :hover ul :hover ul :hover ul :hover ul :hover ul {left:155px; top:-3px; background: #fff; padding:0px 0; border:3px solid #474747; white-space:nowrap; width:155px; z-index:200; height:auto; z-index:300;} /* ^flyout start location */ /* ====== NOTES ======== */ /* 1 hover = drop down */ /* 2 hovers = 1st flyout */ /* 3 hovers = 2nd flyout */ /* set up individual drop down sub levels */ /* --------- */ /* Communities */ .menu :hover ul.p2 {width:185px;} .menu :hover ul.p2 li {width:185px;} .menu :hover ul.p2 li a {width:185px;} .menu :hover ul.p2 li a.fly {background:#fff url("../shared/menu/images/arrow.gif") 170px 7px no-repeat;} .menu :hover ul.p2 li a.fly:hover {background:#ccc url("../shared/menu/images/arrow_over.gif") 170px 7px no-repeat;} /* Background & Text Color of menu items that HAVE a fly out */ .menu :hover ul.p2 li:hover > a.fly {background:#ccc url("../shared/menu/images/arrow_over.gif") 170px 7px no-repeat;} /* Background & Text Color of menu items AFTER they fly out */ /* Features */ .menu :hover ul.p3 {width:190px;} .menu :hover ul.p3 li {width:190px;} .menu :hover ul.p3 li a {width:190px;} .menu :hover ul.p3 li a.fly {background:#fff url("../shared/menu/images/arrow.gif") 175px 7px no-repeat;} .menu :hover ul.p3 li a.fly:hover {background:#ccc url("../shared/menu/images/arrow_over.gif") 175px 7px no-repeat;} /* Background & Text Color of menu items that HAVE a fly out */ .menu :hover ul.p3 li:hover > a.fly {background:#ccc url("../shared/menu/images/arrow_over.gif") 175px 7px no-repeat;} /* Background & Text Color of menu items AFTER they fly out */ /* set up individual 1st flyout levels when hovering */ /* --- ------ */ .menu :hover ul.p1 :hover ul li.specials a {background:#FFFF99;} /* */ .menu :hover ul.p1 :hover ul li.specials:hover a {color:white; background:#990000;} /* */ /* set up individual 1st flyout levels when hovering */ /* --- ------ */ .menu :hover ul.p2 :hover ul {left:185px; width:155px;} .menu :hover ul.p2 :hover ul li {width:155px; height:48px;} .menu :hover ul.p2 :hover ul li a {width:155px; height:40px; line-height: 20px; padding: 4px 0;} /* Padding adds to overall height. That's why height is 40px and not 48px.*/ /* set up individual 1st flyout levels when hovering */ /* --- ------ */ .menu :hover ul.p3 :hover ul {left:190px;} .menu :hover ul.p3 :hover ul li {width:155px;} .menu :hover ul.p3 :hover ul li a {width:155px;} /* set up individual 1st flyout levels when hovering */ /* --- ------ */ .menu :hover ul.p4 :hover ul {left:-161px;} .menu :hover ul.p4 :hover ul li {width:155px;} .menu :hover ul.p4 :hover ul li a {width:155px;} /* set up individual 2nd flyout levels when hovering */ /* --- ------ */ .menu :hover ul.p1 :hover ul :hover ul li.title a {color: white; background:#474747;} /* */ .menu :hover ul :hover ul :hover ul.price {width:145px;} .menu :hover ul :hover ul :hover ul.price li {width:145px;} .menu :hover ul :hover ul :hover ul.price li a {width:145px;} .menu :hover ul :hover ul :hover ul.size {width:145px;} .menu :hover ul :hover ul :hover ul.size li {width:145px;} .menu :hover ul :hover ul :hover ul.size li a {width:145px;} .menu :hover ul :hover ul :hover ul.style {width:145px;} .menu :hover ul :hover ul :hover ul.style li {width:145px;} .menu :hover ul :hover ul :hover ul.style li a {width:145px;} .menu :hover ul :hover ul :hover ul.location {width:235px;} .menu :hover ul :hover ul :hover ul.location li {width:235px;} .menu :hover ul :hover ul :hover ul.location li a {width:235px;} .menu br { line-height: 0px; } /* ???? */ a.bold {font-weight: bold;} /* ============================================================================================== Content Container ----------------- Area that holds the Gallery and the Information Panel. ============================================================================================== */ #contentContainer3 { float: left; width: 948px; /* Width of Whole Panel */ background: #474747; overflow: hidden; position: relative; margin-bottom: 20px; /* Only 12px shows; Only on Container 3 since it is the outside container; */ } #contentContainer2 { float: left; width: 948px; /* Width of Whole Panel */ background: #eae8db; /* Gutter Color */ position: relative; right: 224px; /* Width of Right Panel */ } #contentContainer1 { float: left; width: 948px; /* Width of Whole Panel */ background: #eae8db; /* Gutter Color -- in case right panel (information Panel) is longer than left panel */ position: relative; right: 12px; /* Width of Gutter */ } /* ============================================================================================== Gallery ------- Area that holds the two sections: Slide Show (or Flash Movie) and description. ============================================================================================== */ #gallery { float: left; width: 664px; /* Width of Left Panel - Border Width x 2 - Left Padding - Right Padding */ position: relative; left: 236px; /* Width of Right Panel + Width of Gutter */ border: 6px solid #cccccc; padding-top: 4px; padding-right: 18px; padding-bottom: 5px; padding-left: 18px; color: black; background-color:white; } #gallery h2 { font-family: "Trebuchet MS", Arial, sans-serif; font-size: 36px; font-weight: normal; color: black; margin: 0px; margin-bottom: 0px; } /* ============================================================================================== Wrapped Text inside Gallery --------------------------- Area to the right of the slideshow that holds the slide show & the community description if the description is to be wrapped around the text. ============================================================================================== */ #galleryWrappedText { float: left; padding: 0px; width: 664px; /* 232px for description on right side of slide show */ } #galleryWrappedText p { margin-top: 0px; margin-bottom: 10px; font-size:14px; line-height: 19px; /* Necessary in IE for hover border to show up */ color: black; text-decoration:none; } #galleryWrappedText a { color: black; text-decoration:underline; } #galleryWrappedText a:hover { border-bottom: 1px double black; } /* ============================================================================================== gallerySlideShowColumn ---------------------- This is used when it is desired that the Slide Show is in a column with content below. ============================================================================================== */ #gallerySlideShowColumn { float: left; padding: 0px; width: 430px; } /* Area below 400x300 SlideShow that is inside gallerySlideShowColumn */ #galleryCenteredAreaBelowSlideShow { width: 430px; margin: auto; background-color:#CC6699; } /* 238 x 325 area to right of 400x300 SlideShow that is inside gallery */ #galleryRightOfSlideShow { width: 238px; margin-left: 16px; float: left; } /* ============================================================================================== 400 x 300 Slide Show w/ Caption ------------------------------- Area that holds the JavaScript Slide Show & Caption. Setup for 400 x 300 photo. ============================================================================================== */ #slideShowContainer { float: left; margin-bottom: 10px; /* 18 seems to bump the wrapping paragraph down one line */ margin-right: 16px; width: 410px; /* 400 for photo, 10 for shadow */ height: 355px; background-color:aqua; background: url('/shared/slideshow/images/medium/SlideshowShadow.png'); background-repeat: no-repeat; } #slideShow400x300 { width: 400px; height: 355px; /* 300 for photo, 55 for thumbnail viewer (10 for shadow, 5 for margin, 40 for thumbnail) */ } #slideShowContainer a:hover { border-bottom: 0px; } #slideShowContainer p { /* Caption */ margin-top: 5px; margin-bottom: 0px; font: "Trebuchet MS"; font-weight: bold; font-size: 15px; background-color: white; z-index: 0; } /* ============================================================================================== SlideShow --------- CSS for actual slide show. This CSS should not be changed to accomplish positioning, etc. of slide show. This section must come after the "slideShowContainer" section. ============================================================================================== */ #slideshow { position:relative; } #slideshow DIV { position:absolute; top:0; left:0; z-index:8; opacity:0.0; background-color:transparent; /* Transparent won't work because the captions start piling up */ } #slideshow DIV.active { z-index:10; opacity:1.0; } #slideshow DIV.last-active { z-index:9; } #slideshow DIV IMG { display: block; border: 0; margin-bottom: 0px; } /*#slideshow IMG { position:absolute; top:0; left:0; z-index:8; opacity:0.0; } #slideshow IMG.active { z-index:10; opacity:1.0; } #slideshow IMG.last-active { z-index:9; }*/ /* ============================================================================================== Tabs ---- Area for tabs. ============================================================================================== */ #tabs { /* height: auto; overflow: hidden; padding: 0px;*/ margin-bottom: 12px; color: black; } #tabs h2 { margin: 0px; } #floorplans { text-align: center; } #floorplans img { padding: 15px; } #floorplans h2 { font-size: 24px; } /* ============================================================================================== Footer ------ Area for other information. ============================================================================================== */ #footer { margin: 0px; border: 1px solid black; padding: 20px; background-color: white; overflow: auto; } /* ============================================================================================== Copyright -------- Area where the copyright goes. ============================================================================================== */ #copyright { margin-top: 8px; /* For IE */ margin-bottom: 0px; } #copyright p { margin-top: 0px; margin-bottom: 0px; font-size: 11px; font-family: "Trebuchet MS"; font-weight: normal; color: black; text-decoration: none; } #copyright a { margin-top: 0px; margin-bottom: 0px; font-size: 11px; font-weight: normal; color: black; text-decoration: none; } #copyright a:hover { text-decoration: underline; } /* ============================================================================================== THE STYLES BELOW ARE FOR THE HOME DESIGNS ROW THAT COULD BE USED IN MULTIPLE LOCATIONS THROUGHOUT THE WEBSITE SUCH AS COMMUNITIES AND HOME DESIGNS WHICH IS WHY IT IS IN THE CORE. /* ============================================================================================== /* ============================================================================================== homeDesignRow ------------- Row for each home design. Row is divided into three columns: Photo, Summary & Details. Each column has its own container. ============================================================================================== */ .homeDesignRow { height: auto; /* 204px was what I originally had, but changed to auto in case "At a Glance" text or detail bullets were long. */ margin: 0px; border: 0px; padding-top: 16px; padding-left: 12px; padding-right: 12px; padding-bottom: 10px; background-color: #CDCABF; background-image: url(/shared/homeDesigns/images/bg_row.jpg); background-repeat: repeat-x; overflow: auto; } /* ---------------------------------------------------------------------------------------------- PHOTO COLUMN ------------ Leftmost column in the Home Design Row. ---------------------------------------------------------------------------------------------- */ .homeDesignPhotoColumn { float: left; width: 204px; margin-right: 16px; } .homeDesignPhotoContainer { width: 204px; height: 158px; margin: 0px; background: url("/shared/homeDesigns/images/Photo-Shadow.png"); background-repeat: no-repeat; } .homeDesignPhotoContainer img { /* Photo */ float: left; border: 0; padding: 0; width: 200px; height: 150px; } .homeDesignPhotoContainer .elevation { /* Elevation */ background-color: #FFFCDF; /* Light Yellow */ } .homeDesignPhotoContainer .overlay { /* Optional Overlay Graphic */ margin-left: -200px; z-index: 100; } .homeDesignPhotoColumn .moreinfo a { margin-top: -15px; /* I have now idea why I need this. It should be 0. */ margin-bottom: 6px; display: block; width: 202px; height: 40px; background: url(/shared/homeDesigns/images/button_1.png); } .homeDesignPhotoColumn .moreinfo a:link, .homeDesignPhotoColumn .moreinfo a:visited { background: url(/shared/homeDesigns/images/button_0.png); } .homeDesignPhotoColumn .moreinfo a:hover, .homeDesignPhotoColumn .moreinfo a:focus { background: url(/shared/homeDesigns/images/button_1.png); } /* Sales Representative */ .homeDesignPhotoColumnAgent { margin-top: 4px; margin-bottom: 0px; text-align: center; color: #474747; } .homeDesignPhotoColumnAgent h3 { margin: 0; font-size: 15px; font-weight: bold; text-decoration: none; } .homeDesignPhotoColumnAgent h4 { margin-top: 0px; margin-bottom: 0px; font-size: 14px; line-height: 19px; /* Necessary in IE for hover border to show up */ font-weight: normal; text-decoration: none; } .homeDesignPhotoColumnAgent h4 a { color: #474747; font-weight: normal; text-decoration: underline; } .homeDesignPhotoColumnAgent h4 a:hover { border-bottom: 1px double #474747; } .homeDesignPhotoColumnAgent p { margin-top: 0px; margin-bottom: 0px; font-size: 13px; font-weight: normal; text-decoration: none; } /* ---------------------------------------------------------------------------------------------- SUMMARY COLUMN -------------- Middle column in the Home Design Row. After a heading that is centered across the column, there are two sub-columns (At a Glance & Home Size) which each have their own container. ---------------------------------------------------------------------------------------------- */ .homeDesignSummaryColumn { float: left; width: 308px; margin-right: 16px; border: 0; text-align: center; color: #474747; } /* The Westchester ... */ .homeDesignSummaryColumn h2 { margin-top: -5px; margin-bottom: 0px; font-size: 30px; font-weight: normal; text-decoration: none; } .homeDesignSummaryColumn h2 a { color: #474747; text-decoration: none; } .homeDesignSummaryColumn h2 a:hover { text-decoration: underline; } /* Starting from the ... */ .homeDesignSummaryColumn h3 { margin-top: 0px; margin-bottom: 10px; font-size: 17px; font-weight: normal; text-decoration: none; } /* At a Glance Header ... */ .homeDesignSummaryColumn h4 { margin-top: 0px; margin-bottom: 1px; font-size: 15px; font-weight: bold; text-decoration: none; } /* Street Address */ .homeDesignSummaryColumn h5 { margin-top: 0px; margin-bottom: 4px; font-size: 11px; font-weight: normal; text-decoration: none; } .homeDesignSummaryColumn h5 a { color: #474747; font-weight: normal; text-decoration: underline; } .homeDesignSummaryColumn h5 a:hover { border-bottom: 1px double #474747; } .homeDesignSummaryColumn p { margin-top: 0px; margin-bottom: 0px; font-size: 11px; font-weight: normal; text-decoration: none; } /* At a Glance Container - Contains Home Size Column in Addition to "At a Glance" text */ .homeDesignSummaryAtAGlanceColumn { float: left; width: 308px; margin-right: 0px; border: 0; padding-top: 0px; text-align: center; } .homeDesignSummaryAtAGlanceColumn p { text-align: justify; line-height: 16px; } /* Home Size Container */ .homeDesignSummaryHomeSizeColumn { float: right; margin-left: 15px; border: 0; padding-top: 0px; text-align: center; } /* 116px wide seems to be the bare minimum. If I dont set the width, the rule image, if set over 114px wide, makes the table jumpt to about 125px wide. Why??? When setting the table width, I also have to set the column widths. If I set no table width, the column widths work great with no setting, but I still have the rule problem. The
tag would work the best, but it is displayed differently in each browser. */ #homeDesignSummaryHomeSizeTable { border-collapse: collapse; border-spacing: 0px; table-layout: fixed; width: 120px; margin: 0px; padding: 0px; } .homeDesignSummaryHomeSizeRow { height: 16px; } .homeDesignSummaryHomeSizeHorizontalRuleColumn { text-align: right; } .homeDesignSummaryHomeSizeHorizontalRuleColumn img { margin-top: 1px; margin-right: 0px; margin-bottom: 3px; margin-left: 0px; width: 120px; } .homeDesignSummaryHomeSizeSqareFootageColumn { margin: 0px; padding: 0px; width: 52px; } .homeDesignSummaryHomeSizeSqareFootageColumn p { margin-right: 8px; text-align: right; line-height: 11px; } .homeDesignSummaryHomeSizeDescriptionColumn { margin: 0px; padding: 0px; width: 68px; } .homeDesignSummaryHomeSizeDescriptionColumn p { text-align: left; line-height: 11px; } /* ---------------------------------------------------------------------------------------------- DETAILS COLUMN -------------- Rightmost column in the Home Design Row. After a heading that is centered across the column, there are three sub-columns (1st Floor, 2nd Floor & Lower Level) which each have their own container. ---------------------------------------------------------------------------------------------- */ .homeDesignDetailsColumn { float: left; width: 372px; margin-right: 0px; border: 0; text-align: center; } .homeDesignDetailsColumn p { margin-top: 0px; margin-bottom: 0px; font-size: 11px; font-weight: normal; color: #474747; text-decoration: none; } .homeDesignDetailsColumn h3 { margin-top: 0px; margin-bottom: 0px; font-size: 24px; font-style: italic; font-weight: normal; color: #474747; text-decoration: none; } .homeDesignDetailsColumn h4 { margin-top: 3px; margin-bottom: 3px; font-size: 18px; font-weight: normal; color: #474747; text-decoration: none; } .homeDesignDetailsColumn img { /* for horizontal rule image */ margin-top: 2px; margin-bottom: 2px; } .homeDesignDetailsColumn ul { margin-top: 0px; margin-left: 10px; /* Need to leave 10 on margin and 10 on padding b/c IE uses one and the others use the other. */ padding-left: 10px; margin-bottom: 0px; /* For some reason, default margin-bottom is > 0px */ list-style-type: square; } .homeDesignDetailsColumn li { font-size: 11px; font-weight: normal; line-height: 15px; color: #474747; text-decoration: none; } /* 1st Floor Container */ .homeDesignDetails1stFloorColumn { float: left; width: 116px; margin-right: 12px; border: 0; text-align: left; } /* 2nd Floor Container */ .homeDesignDetails2ndFloorColumn { float: left; width: 116px; margin-right: 12px; border: 0; text-align: left; } /* 3rd Floor Container */ .homeDesignDetailsLowerLevelColumn { float: left; width: 116px; margin-right: 0px; border: 0; text-align: left; } /* ============================================================================================== Community Information Panel --------------------------- Area on right side that contains information about a specified community. ============================================================================================== */ #communityInformation { float: left; width: 188px; /* Width of Right Panel - Border x 2 - Left Padding - Right Padding */ position: relative; left: 248px; /* Width of Right Panel + Left Padding + Right Padding ?? */ border: 6px solid #474747; padding: 2px 12px; color: white; } #communityInformation h2 { margin-top: 0px; margin-bottom: 7px; font-size: 35px; font-weight: 400; } #communityInformation h3 { margin-top: 0px; margin-bottom: 0px; font-size: 15px; font-weight: 700; } #communityInformation p { margin-top: 0px; margin-bottom: 18px; font-size: 13px; } #communityInformation a { color: white; text-decoration: underline; } #communityInformation a:hover { border-bottom: 1px white double; } #communityInformation table { margin-top: 0px; margin-bottom: 18px; font-size: 13px; line-height:15px; }