/** * Search Page CSS (Template #1) */ #IDX-searchPageWrapper { position: relative; text-align:center; width:600px; margin-left:50px;} #IDX-searchPageWrapper input, #IDX-searchPageWrapper select { border: 1px #999 solid; } /** * NAVIGATION wrapper * This controls the links such as Basic Search, Address Search, etc */ #IDX-searchNavWrapper { text-align: center; margin: 4px 0; } .IDX-searchNav { display: inline; font-size: 10pt; padding: 0 5px; } .IDX-searchInput { display: inline; } #IDX-searchNavBasicSearch, #IDX-searchNavAddressSearch, #IDX-searchNavListingSearch {} #IDX-propertyTypes { margin: 8px 0; } #IDX-searchPagesfrTypes input { border: 0; } #IDX-propTypeTextLinks { display: none; } /** * LISTS and city/county/zip box */ #IDX-geoBoxWrapper { position: relative; } #IDX-geoBox { clear: both; } #IDX-listBox { clear: both; position: relative; text-align: left; height: 151px; } /* This controls the radio buttons and their labels */ #IDX-searchCitySearch { width: 180px; height: 120px; padding-top: 11px; position: absolute; top: 15px; left: 100px; text-align: right; } #IDX-searchCitySearch .IDX-searchLabel { clear: both; float: left; width: 155px; height: 16px; text-align: right; padding: 10px 0; } #IDX-searchCitySearch .IDX-searchInput { float: right; padding: 10px 0; height: 16px; } #IDX-searchCitySearch input { border: 0; } /* These extra divs are for the Search By image - #2 is for dark background, #1 for light */ #IDX-searchExtra1 { display: none; } #IDX-searchExtra2 { display: none;} /* This is for the different list types, city/county/zip */ #IDX-searchPage-cityField .IDX-searchLabel { visibility: hidden; } #IDX-searchPage-zipCodeField .IDX-searchLabel { visibility: hidden; } #IDX-searchPage-countyField .IDX-searchLabel { visibility: hidden; } #IDX-searchPage-cityField { display: block; width: 49%; clear: none; float: left; } #IDX-searchPage-zipCodeField { display: none; width: 49%; clear: none; float: left; } #IDX-searchPage-countyField { display: none; width: 49%; clear: none; float: left; } #IDX-searchPage-cityField select { width: 175px; height: 133px; } #IDX-searchPage-zipCodeField select { width: 175px; height: 133px; } #IDX-searchPage-countyField select { width: 175px; height: 133px; } /* This wraps around the basic elements and the searchSubmit fields */ #IDX-searchBoxWrapper { position: relative; width: 558px; height: 118px; } /** * BASIC search box */ #IDX-basicBox { position: relative; text-align: left; height: 118px; z-index: 5; } /* Individual fields are positioned absolutely */ #IDX-minPrice { position: absolute; top: 0; left: 16%; width: 90px; } #IDX-maxPrice { position: absolute; top: 0; left: 36%; width: 90px; } #IDX-searchDateAdded { position: absolute; top: 0; left: 56%; width: 120px; } #IDX-minPrice input { width: 85px; } #IDX-maxPrice input { width: 85px; } #IDX-searchDateAdded input { width: 50px; } #IDX-searchBedRooms { position: absolute; top: 40px; left: 16%; } #IDX-searchBedRooms input { width: 80px; } #IDX-searchBathRooms { position: absolute; top: 40px; left: 36%; } #IDX-searchBathRooms input { width: 80px; } #IDX-searchSqFt { position: absolute; top: 81px; left: 16%; } #IDX-searchSqFt input { width: 85px; } #IDX-searchSortByPrice { position: absolute; top: 40px; left: 56%; } #IDX-searchAcres { position: absolute; top: 40px; left: 21%; } /** * Limit, Resultsperpage box */ #IDX-searchSubmitSort { position: relative; float: right; bottom: 41px; right: 57px; text-align: left; z-index: 10; width: 300px; height: 0; } #IDX-searchPerPage { position: absolute; top: 4px; left: 0; } #IDX-searchReset { position: absolute; top: 19px; left: 37%; } #IDX-searchSubmit { position: absolute; top: 16px; left: 67%; } #IDX-searchReset input { background: #E0E0E0; color: #000; font-size: 10pt; } #IDX-searchSubmit input { background: #E0E0E0; color: #000; font-weight: bold; font-size: 12pt; } /** * ADVANCED search box */ #IDX-advancedBox { clear: both; width: 100%; text-align: center; } #IDX-advancedBox select.IDX-trimSelect { width: 100%; } #IDX-advancedSearchFields { padding: 0; margin: 0; } #IDX-advancedSearchLeft { width: 49%; float: left; } #IDX-advancedSearchRight { width: 49%; float: right; } #IDX-searchClear { clear: both; } /** * Results page CSS (Template #1) */ .IDX-resultsCell { clear: both; width:700px; height: 140px; text-align: left; position: relative; border-bottom:1px #007759 solid; margin:10px 0; } .IDX-resultsCellDark { } #IDX-userWrapper .IDX-resultsCell { width:700px; } .IDX-resultsAddress { font-weight: bold; font-size: 9pt; width: 80%; height: 16px; overflow: hidden;} .IDX-resultsAddress a:link, .IDX-resultsAddress a:hover, .IDX-resultsAddress a:active, .IDX-resultsAddress a:visited { } .IDX-resultsPhoto { position: absolute; top:24px; left:5px;} .IDX-resultsPhoto img {border:1px #007759 solid; width:140px; height:103px;} .IDX-resultsPrice { position: absolute; top:24px; left:180px; font-weight: bold; font-size:14px;} .IDX-resultsSidePanel { position: absolute; top:50px; left:160px; line-height: 13px; font-size: 8pt;} .IDX-resultsSideListingID {position:absolute; top:0; left:80%; height:16%; width:20%; font-size:7pt;} .IDX-detailsMLSLogo {position:absolute; top:50%; left:80%; width:100px; height:50px;} .IDX-detailsMLSCourtesy { position: absolute; bottom:2px; left: 0; width: 100%; height: 15px; text-align: right; overflow: hidden; font-size: 8pt;} .IDX-resultsMapIndicator { font-weight: 100; font-size: 8pt; position: absolute; top: 16px; left: 81%; } .IDX-resultsDescription {position:absolute; top:84px; left:300px; line-height:16px; font-size:11px; font-weight:100;} .IDX-resultsDescriptionBlank { display: none; } .IDX-resultsSideLabel { font-weight: bold; margin-right: .1em; } .IDX-resultsSideValue { } /* Placeholders for the individual items on the side panel. */ .IDX-resultsSideMLS { display: none; } .IDX-resultsSideBedrooms { clear: both; } .IDX-resultsSideBathrooms { clear: both; } .IDX-resultsSideHalfBaths { clear: both; } .IDX-resultsSideSqFt { clear: both; } .IDX-resultsSideAcres { clear: both; } .IDX-resultsDetailsLink { position: absolute; top: 35px; left: 81%; font-weight: bold; } .IDX-resultsLinks { position: absolute; top:35px; left: 52.8%; line-height: normal; } .IDX-resultsLinks a:link, .IDX-resultsLinks a:hover, .IDX-resultsLinks a:active, .IDX-resultsLinks a:visited { font-size: 8pt; font-weight: 100; } .IDX-resultsGalleryLink { } .IDX-resultsSavePropertyLink { } .IDX-resultsOpenHouseLink { } .IDX-resultsVirtualTourLink { } /** * Details CSS ( Template #1 ) */ #IDX-detailsWrapper { width:700px; text-align: left; } #IDX-detailsTopNav { } #IDX-prevProp {width:120px;} #IDX-nextProp {width:100px;} #IDX-detailsWarning { height: 20px; } #IDX-detailsTopLinks { width:500px; height: 18px; border: 0; text-align: center; padding-bottom:10px;} #IDX-detailsLinkNew { float: left; width: 100px; } #IDX-detailsLinkModify { float: left; width: 110px; border-left: 1px #AAA solid; } #IDX-detailsLinkSave { float: left; width: 110px; border-left: 1px #AAA solid; } #IDX-detailsLinkBack { float: left; width: 120px; border-left: 1px #AAA solid; } #IDX-detailsEssential { clear: both; width: 100%; padding-top: 4px; } #IDX-detailsMainPhoto {border:1px #007759 solid; float: left; } #IDX-detailsMainPhoto img {width:400px; height:300px;} div.IDX-detailsSideInfo { float: left; padding: 8px 8px 0 8px; margin-left:40px; line-height: normal; width:210px;} div.IDX-detailsAddressBox { font-weight: bold; overflow: hidden; } #listingNumber { } div.IDX-detailsPrice { font-size: 12pt; width: 100%; text-align: center; font-weight: bold; } div.IDX-detailsGalleryLink { clear: both; width:400px; text-align: center; padding: 3px 0 4px 0; } img.IDX-detailsPhotoThumb {} div.IDX-detailsSpacer { clear: both; height:12px; } /** Agent's headshot on the details page */ #IDX-detailsAgentInfo { clear: both; margin: 2px 0 15px 0; padding: 5px 0; width: 75%; text-align: left;} #IDX-detailsAgentPhoto { float: left; margin-left: 5px;} #IDX-detailsAgentText { text-align: center; } #IDX-detailsAgentName { font-weight: bold; margin-top: 15px; } #IDX-detailsAgentTitle { font-style: italic; margin-bottom: 15px; } #IDX-detailsAgentCellPhone { } #IDX-detailsAgentOfficePhone { } #IDX-detailsAgentEmail { } #IDX-detailsAgentWebsite { } div.IDX-detailsRemarksWrapper { float: left; margin: 10px 0; width:510px; } div.IDX-detailsRemarks { text-align: left; padding: 4px;} div.IDX-detailsRemarksEmpty { height: 20px; width:510px; text-align: center; margin-top: 5px; padding: 50px 0; font-style: italic; } div.IDX-detailsLinks { float: left; width: 152px; text-align: left; margin: -12px 2px 0 26px; } .IDX-detailsLink { margin: 2px 0 0 30px; } #IDX-main .IDX-detailsLink a:link, #IDX-main .IDX-detailsLink a:hover, #IDX-main .IDX-detailsLink a:active, #IDX-main .IDX-detailsLink a:visited { color: #444; text-decoration: none; } .IDX-detailsLinks div {background-color:#fff; width: 150px; height: 20px;border: 1px #888 solid; margin: 2px 0; } .IDX-detailsLinks div:hover {border:1px #aaa solid; background-color:#eee; } .IDX-detailsLinks div div {background-color:transparent; border:none; width:auto; height:auto; margin: 2px 0 0 30px;} .IDX-detailsLinks div div:hover {border:none; background-color:transparent; } .IDX-linkOpenHouse { background: url(/images/layout/details/openHouse.png); } .IDX-linkShowing {background: url(/images/layout/details/showing.png); } .IDX-linkVirtualTour { background: url(/images/layout/details/virtualTour.png); overflow: hidden; } .IDX-linkPrint { background: url(/images/layout/details/print.png); } .IDX-linkEmail { background: url(/images/layout/details/email.png); } .IDX-linkMap { background: url(/images/layout/details/map.png); } .IDX-linkMoreInfo { background: url(/images/layout/details/moreInfo.png);} .IDX-linkCalculator { background: url(/images/layout/details/calculator.png); } .IDX-linkCustom{ background: url(/images/layout/details/customLink.png); } div.IDX-detailsSectionTitle { font-size: 14pt; } div.IDX-detailsBasic { width: 100%; clear: both;} div.IDX-detailsBasicLeft { width: 49%; float: left; border-top: 1px #007759 solid; } div.IDX-detailsBasicRight {width: 49%; float: left; overflow: hidden; } div.IDX-detailsAdvanced { width:100%; clear: both; } div.IDX-detailsAdvancedLeft { width: 49%; float: left; border-top: 1px #007759 solid; overflow: hidden; } div.IDX-detailsAdvancedRight { width: 49%; float: right; overflow: hidden; } div.IDX-detailsFooter {clear: both; text-align: center; width: 100%; padding-top: 8px; border-top: 1px #007759 solid; } div.IDX-detailsMoreInfoForm { width: 100%; text-align:left; padding: 6px 2px; border-top: 1px #007759 solid; clear: both; } /** * Contact CSS (Template #1) */ div.IDX-contactWrapper { width:600px; text-align: left; } div.IDX-contactWrapper input { padding: 0; } div.IDX-contactWrapper table { width: 100%; } div.IDX-contactForm { width: 45%; float:left; border-right: 1px #007759 dashed; margin-left: 30px; padding-right: 15px; } div.IDX-contactSideInfo { width:40%; float:right; margin-left: 10px; } #IDX-contact {} #IDX-contactMapLink { margin-top: 3px; } #IDX-emailContactHeader {font-weight:bold;} #IDX-leadNameLabel {font-weight:normal;} #IDX-leadNameInput {font-weight:normal;} #IDX-leadEmailLabel {font-weight:normal;} #IDX-leadEmailInput {font-weight:normal;} #IDX-leadPhoneLabel {font-weight:normal;} .IDX-leadPhoneInput {font-weight:normal;} #IDX-leadMessageLabel {font-weight:normal;} #IDX-leadMessageInput {font-weight:normal;} #IDX-leadFormSubmit {width: 110px; border: 1px #444 solid; background: #E0E0E0;} #IDX-phoneContactHeader {font-weight:bold;} #IDX-officeDisplayName {font-weight:bold;} #IDX-officeAddressNumber {font-weight:normal;} #IDX-officeAddressExtra {font-weight:normal;} #IDX-officePhone {font-weight:normal;} #IDX-officePhoneLabel {font-weight:bold;} #IDX-officeFax {font-weight:normal;} #IDX-officeFaxLabel {font-weight:bold;} #IDX-officeAdditional {font-weight:normal;} #IDX-officeAdditionalLabel {font-weight:bold;} /** * Mortgage Calculator (Template #1) */ #IDX-mortgagePrice, #IDX-mortgageDown, #IDX-mortgageRate, #IDX-mortgageLength, #IDX-mortgageAmortization, #IDX-mortgageSubmit, #IDX-mortgageStatus { width: 310px; height: 30px; position: relative; text-align: center; } #IDX-mortgageStatus { color: #FF0000; font-size: 14px; } #IDX-amortTable { width: 510px; border-collapse: collapse; } .IDX-mortgageLeftCell { width: 110px; height: 30px; text-align: right; float: left; } .IDX-mortgageMiddleCell { width: 100px; height: 30px; text-align: left; float: left; } .IDX-mortgageRightCell { width: 80px; height: 30px; text-align: left; float: left; } .IDX-mortgageLongCell { width: 290px; height: 30px; text-align: center; float: left; } .IDX-mortgageHelpCell { width: 20px; height: 30px; text-align: center; float: right; } .IDX-mortgageAmortCell1, .IDX-mortgageAmortCell2, .IDX-mortgageAmortCell3, .IDX-mortgageAmortCell4 { background-color: #EEE; border: 1px #FFFFFF solid; text-align: right; } .IDX-mortgageAmortCell1 { text-align: center; } .IDX-mortgageAmortYear { } .IDX-mortgageAmortTitle1, .IDX-mortgageAmortTitle2, .IDX-mortgageAmortTitle3, .IDX-mortgageAmortTitle4 { font-weight: bold; text-align: center; } /** * Map Search (Template #1) */ #IDX-propTypeTextLinks { display: none; } #IDX-searchNavWrapper { margin: 5px auto; text-align: center; } #IDX-mapPropertyTypes { float: left; } #IDX-mapPropertyTypes select { border: 1px #AAA solid; } /* This link allows a user to save a map search directly */ #IDX-saveMapSearch { float: left; } #IDX-googleMap { width:700px; height: 360px; clear: both; position: relative; overflow: hidden; border: 1px #007759 solid; margin:10px 0;} /* This holds the informational text regarding the number of properties found in a given search */ #IDX-mapInfo { width: 370px; height: 14px; margin: 5px 0 5px 0; float: right; font-size: 11px; text-align: right; } /* The controls float near the google map and add additional features to the core Google Controls */ #IDX-mapControls { width: 96px; height: 100%; position: absolute; top: 0; left: 0; background: url(/images/layout/mapSearch/20-controlBg.jpg) top left repeat-y; border-right: 1px #AAA solid; } #IDX-mapContainer { color: #000; background: #E5E3DF url(http://www.idxco.com/images/layout/gload.gif) top center no-repeat; } #IDX-mapContainer a:link, #IDX-mapContainer a:hover, #IDX-mapContainer a:active, #IDX-mapContainer a:visited { color: #000; } /* The mapWithContainer should normally be #IDX-googleMap width minus #IDX-mapControls width minus border width. In this case, 580 - 96 - 3 = 481px */ .IDX-mapWithContainer { width:603px; height: 360px; position: absolute; top: 0; left: 97px; } .IDX-mapWithoutContainer { width: 100%; height: 100%; } #IDX-mapOverlay { width: 150px; height: 50px; position: absolute; top: 10px; right: 10px; z-index: 500; display: none; background: url(/images/layout/mapSearch/overlay.gif); } /** * These are the specific control CSS declarations for Map Search Template #1 */ .directionButton { cursor: pointer; margin: 0; padding: 0; border: 0; } /* Row 1 */ #IDX-mapNw { width: 35px; height: 35px; float: left; background: url(/images/layout/mapSearch/20-nw.jpg); } #IDX-mapN { width: 27px; height: 35px; float: left; background: url(/images/layout/mapSearch/20-n.jpg); } #IDX-mapNe { width: 34px; height: 35px; float: left; background: url(/images/layout/mapSearch/20-ne.jpg); } /* Row 2 */ #IDX-mapW { width: 35px; height: 27px; float: left; background: url(/images/layout/mapSearch/20-w.jpg); } #IDX-mapCenter { width: 27px; height: 27px; float: left; background: url(/images/layout/mapSearch/20-center.jpg); } #IDX-mapE { width: 34px; height: 27px; float: left; background: url(/images/layout/mapSearch/20-e.jpg); } /* Row 3 */ #IDX-mapSw { width: 35px; height: 40px; float: left; background: url(/images/layout/mapSearch/20-sw.jpg); } #IDX-mapS { width: 27px; height: 40px; float: left; background: url(/images/layout/mapSearch/20-s.jpg); } #IDX-mapSe { width: 34px; height: 40px; float: left; background: url(/images/layout/mapSearch/20-se.jpg); } /* Zoom In/Out Functionality */ .zoomButton { cursor: pointer; margin: 0; padding: 0; border: 0; } #IDX-zoomRow { width: 96px; height: 52px; position: relative; clear: both; background: url(/images/layout/mapSearch/20-zoomBg.jpg); } #IDX-mapZoomIn { width: 39px; height: 21px; position: absolute; top: 25px; left: 10px; background: url(/images/layout/mapSearch/20-zoomIn.jpg); } #IDX-mapZoomOut { width: 38px; height: 21px; position: absolute; top: 25px; left: 49px; background: url(/images/layout/mapSearch/20-zoomOut.jpg); } /* DragZoom button and DragZoom Undo Button */ #IDX-mapButtonContainer { width: 96px; height: 75px; position: relative; clear: both; background: url(/images/layout/mapSearch/20-dragBg.jpg); } /* These work in combination to draw the Custom Zoom button */ #gzoom-control {position: absolute; top: 38px; left: 10px; } #IDX-dragCustomZoom { background: url(/images/layout/mapSearch/20-dragLeft.jpg); } /* These work in combination to draw the Custom Undo button */ #gzoom-back { position: absolute; top: 38px; left: 48px; } .IDX-dragUndoCustomOn { background: url(/images/layout/mapSearch/20-dragUndo-h.jpg); } .IDX-dragUndoCustomOff { background: url(/images/layout/mapSearch/20-dragUndo.jpg); } /* Mode switching allows the map to be drawn with different tilesets */ .mapTypeButton { cursor: pointer; margin: 0; padding: 0; border: 0; } #IDX-modeRow { width: 96px; height: 131px; position: relative; clear: both; background: url(/images/layout/mapSearch/20-modeBg.jpg); } #IDX-mapTypeMap { width: 76px; height: 20px; position: absolute; top: 34px; left: 10px; background: url(/images/layout/mapSearch/20-modeMap.jpg); } #IDX-mapTypeSat { width: 76px; height: 20px; position: absolute; top: 56px; left: 10px; background: url(/images/layout/mapSearch/20-modeSat.jpg); } #IDX-mapTypeHyb { width: 76px; height: 20px; position: absolute; top: 78px; left: 10px; background: url(/images/layout/mapSearch/20-modeHyb.jpg); } #IDX-mapTypeTer { width: 76px; height: 20px; position: absolute; top: 100px; left: 10px; background: url(/images/layout/mapSearch/20-modeTer.jpg); } /* The following CSS controls the general search controls */ #IDX-searchForm { margin: 0; padding: 0; } #IDX-searchBoxWrapper { width:700px; height: 60px; clear: both; margin: 0; padding-bottom:10px;} #IDX-searchBox { width: 440px; height: 55px; margin: 0 auto; } /* This container should be as large as the #IDX-googleMap declaration (minus borders, of course) */ #IDX-mapBasicBox { } #IDX-mapBasicBox input, #IDX-mapBasicBox select { border: 1px #AAA solid; } #lowPrice, #highPrice, #sqFt, #daysOnMarket, #acres { width: 100px; } /* These elements will be display and need CSS */ #IDX-mapMinPrice { float: left; width: 110px; height: 40px; margin-top: 4px; } #IDX-mapMaxPrice { float: left; width: 110px; height: 40px; margin-top: 4px; } #IDX-mapSearchAcres { display: none; float: left; width: 110px; height: 40px; margin-top: 4px; } #IDX-mapSearchBedRooms { float: left; width: 110px; height: 40px; margin-top: 4px; } #IDX-mapSearchBathRooms { float: left; width: 110px; height: 40px; margin-top: 4px; } #IDX-mapSearchHelpText { clear: both; text-align: center; font-size: 8pt; filter:alpha(opacity=50); -moz-opacity:.50; opacity:.50; } /* These elements are not going to be displayed */ #IDX-saveMapSearchLink { display: none; } #IDX-mapSearchDateAdded { display: none; } #IDX-mapSearchSqFt { display: none; } #IDX-mapSearchSubmit { display: none; } #IDX-mapSearchSubmitLink { display: none; }