@charset "UTF-8"; /* SCREEN.SCSS - import other stylesheets here, this file also includes resets */ /* +Resets */ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 100%; margin: 0; padding: 0; height: 100%; } body { margin: 0; padding: 0; height: 100%; } [hidden] { display: none; } b, strong { font-weight: bold; } img { border: 0; } fieldset { border: 0; margin: 0; padding: 0; } button, input { line-height: normal; } input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; } table { border-collapse: collapse; border-spacing: 0; } /* Import common files */ /* Mixins and patterns library */ /* Configuration */ /* Colours */ /* Border box */ /* Layout & Spacing */ /* Site direction */ /* Border Radius */ /* Typography */ /* Forms */ /* Font Sizes */ /* Buttons */ /* Screen Sizes */ /* Z-index */ /* Font sizes */ /* Old IE -- Don't touch */ /*------------------------------------ GCD PATTERNS LIBRARY */ /*------------------------------------ LEGACY Target old versions of IE. Examples @include is-old-ie { display:inline; } @include is-not-old-ie { display:inline-block; } */ /*------------------------------------ OLD-IE */ /*------------------------------------ SCREEN Examples: @include screen-size(sm-max); */ /*------------------------------------ RESOLUTIONS @include screen-size(); */ /*------------------------------------ POSITIONING An array of positioning tools Examples: @include align(top, start) div.parent { @include display(flex); @include align-items(stretch); @include flex-direction(row); @include justify-content(flex-start); } div.parent > div.child { @include flex(1); } @include margin($base-space n) @include padding(n $base-space) @include position(fixed, 0 20px 20px 30%) @include rem(padding, 20px) @include screen-size(sm-max); @include size(20px, 30px) @include vertical-spacing(force) */ /*------------------------------------ ALIGN Shorthand for aligning horizontally and vertically */ /* An alternative to the above which allows you to vertically align any element in IE9+ You may also need to add a transform-style: preserve-3d to the parent */ /*------------------------------------ # FLEXBOX http://dev.w3.org/csswg/css3-flexbox/ http://css-tricks.com/snippets/css/a-guide-to-flexbox/ */ /*------------------------------------ Position */ /*------------------------------------ SUBJECT / OBJECT */ /*------------------------------------ VERTICAL-SPACING (Consistent spacing) */ /*------------------------------------ # ANIMATION Examples: ## Animations don't need a starting point, such as a hover. They just begin as soon as the page is loaded. @include animation-name(scale, slide); @include animation-duration(2s); @include animation-timing-function(ease); @include animation-iteration-count(infinite); // Animation shorthand works the same as the CSS3 animation shorthand @include animation(scale 1.0s ease-in, slide 2.0s ease); @include keyframes(fadeIn) { from { @include transform(scale(0)); } to { @include transform(scale(1)); } } @include transform(translateY(50px)); @include transform-origin(center top); @include transform-style(preserve-3d); ## Transitions define the movement between one state and another. @include transition (all 2.0s ease-in-out); @include transition (opacity 1.0s ease-in 0s, width 2.0s ease-in 2s); @include transition-property (transform); @include transition-duration(1.0s); @include transition-timing-function(ease-in); @include transition-delay(0.5s); */ /*------------------------------------ # ANIMATION The animation mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties. box:hover { @include animation-name(scale, slide); @include animation-duration(2s); @include animation-timing-function(ease); @include animation-iteration-count(infinite); // Animation shorthand works the same as the CSS3 animation shorthand @include animation(scale 1.0s ease-in, slide 2.0s ease); } http://www.w3.org/TR/css3-animations/#the-animation-name-property- Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties. -- From bourbon.io/docs/#animations */ /*------------------------------------ # KEYFRAMES Adds keyframes blocks for supported prefixes, removing redundant prefixes in the block's content @include keyframes(fadeIn) { from { @include transform(scale(0)); } to { @include transform(scale(1)); } } */ /*------------------------------------ # TRANSFORM The CSS transform property lets you modify the coordinate space of the CSS visual formatting model. Using it, elements can be translated, rotated, scaled, and skewed according to the values set The transform-origin CSS property lets you modify the origin for transformations of an element. The transform-style CSS property determines if the children of the element are positioned in the 3D-space or are flattened in the plane of the element. @include transform(translateY(50px)); @include transform-origin(center top); @include transform-style(preserve-3d); */ /*------------------------------------ # TRANSITION The shorthand mixin supports multiple transition. @include transition (all 2.0s ease-in-out); @include transition (opacity 1.0s ease-in 0s, width 2.0s ease-in 2s); To transition specific vendor-prefixed properties (`-webkit-transform, -moz-transform, ...`), do not use the shorthand mixin. Use the individual transition mixins. @include transition-property (transform); @include transition-duration(1.0s); @include transition-timing-function(ease-in); @include transition-delay(0.5s); */ /*------------------------------------ # BACKGROUND Examples: @include background-color(red); // Sets white text if it's darker than a certain amount @include background(linear-gradient(red, green) left repeat); @include background(linear-gradient(red, green) left repeat, radial-gradient(red, orange) left repeat); @include background(url("/images/a.png"), linear-gradient(red, green), center no-repeat orange scroll); @include background-image(url("/images/a.png"), linear-gradient(white 0, yellow 50%, transparent 50%)); // You can list up to ten background images. */ /*------------------------------------ BACKGROUND */ /*------------------------------------ # BACKGROUND-IMAGE The background-image mixin is helpful for chaining multiple comma delimited background images and/or linear/radial-gradients into one background-image property. The Background-image mixin supports up to 10 background-images. Use in combination with the linear-gradient function and the radial-gradient function. // Image asset with a linear-gradient @include background-image(url("/images/a.png"), linear-gradient(white 0, yellow 50%, transparent 50%)); // Multiple linear-gradients - Demo @include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(#4e7ba3, darken(#4e7ba4, 10%))); // NOT SUPPORTED @include background-image(url("/images/a.png") center no-repeat, url("images/b.png") left repeat); // Background-image is not a shorthand property, therefore this doesn't make sense. ## Note about shorthand notation All CSS background properties support comma delimited values. For multiple background images you can specify the background properties like position, repeat, etc. for each image. For example: @include background-image(url("/images/a.png"), url("images/b.png")); background-position: center top, center; background-repeat: no-repeat, repeat-x; -- From bourbon.io/docs/#background */ /*------------------------------------ LINEAR-GRADIENT Gradient Position is optional. Position can be a degree (90deg). Mixin supports up to 10 color-stops. This mixin will output a fallback background-color: #first-color; declaration. A $fallback argument can be passed to change the fallback color. @include linear-gradient(#1e5799, #2989d8); @include linear-gradient(to top, #8fdce5, #3dc3d1); @include linear-gradient(to top, #8fdce5, #3dc3d1, $fallback: red); @include linear-gradient(50deg, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); */ /*------------------------------------ RADIAL-GRADIENT Takes up to 10 gradients. See also the background-image mixin. This mixin will output a fallback background-color: #first-color; declaration. A $fallback argument can be passed to change the fallback color. @include radial-gradient(#1e5799, #3dc3d1); @include radial-gradient(#1e5799, #3dc3d1, $fallback: red); @include radial-gradient(circle at 50% 50%, #eee 10%, #1e5799 30%, #efefef); */ /*------------------------------------ # BORDER http://davidtheclark.github.io/scut/#border Examples: @include border(1px solid red, y n); // Quickly add border styles to particular sides. @include border-image(url(/images/border.png) 27 repeat); @include border-top-radius(20px); */ /*------------------------------------ # BORDER http://davidtheclark.github.io/scut/#border */ /*------------------------------------ # BORDER IMAGE Border-image supports short-hand notation. @include border-image(url(/images/border.png) 27 repeat); */ /*------------------------------------ # BORDER RADIUS Short hand for putting rounded corners on a side of an element @include border-top-radius(20px); */ /*------------------------------------ # CONTAINERS Useful container properties Examples: @include border-box; @include clear; @include media-box(widescreen, iframe); @include media-item; @include triangle(up, 1em, red); */ /*------------------------------------ BORDER BOX */ /*------------------------------------ CLEARFIX From http://nicolasgallagher.com/micro-clearfix-hack/ */ #PropertyNoteTextBoxPicker .input-group.buttons, .dialog__content, .form__actions, .standard-form .input-group, .g-recaptcha, .tabbed-list, .tabbed-list--full, .tabbed-list--plain, .menu__contrast-area, .context-info, .media-item, .property-list--grid, .result__actions, #search-tab-container { *zoom: 1; } #PropertyNoteTextBoxPicker .input-group.buttons:after, .dialog__content:after, .form__actions:after, .standard-form .input-group:after, .g-recaptcha:after, .tabbed-list:after, .tabbed-list--full:after, .tabbed-list--plain:after, .menu__contrast-area:after, .context-info:after, .media-item:after, .property-list--grid:after, .result__actions:after, #search-tab-container:after { content: ''; display: table; clear: both; } /*------------------------------------* MEDIA BOX Used to constrain the proportions of an element with a set width like an iframe. Should be applied to a parent container with the media element nested. e.g.
- landscape - square - portrait - widescreen /*------------------------------------*/ /*------------------------------------ MEDIA-ITEM Allows you to make a simole Media Object like the one here: http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/ Set to the $layout to stacked to make the image and body stack one above the other. */ .context-info, .media-item { *zoom: 1; margin-bottom: 15px; margin-bottom: 15px; display: block; } .context-info:after, .media-item:after { content: ''; display: table; clear: both; } @media only screen and (max-width: 48em) { .context-info, .media-item { margin-bottom: 14.25px; margin-bottom: 14.25px; } } @media only screen and (max-width: 30em) { .context-info, .media-item { margin-bottom: 13.5px; margin-bottom: 13.5px; } } .context-info:last-child, .media-item:last-child { margin-bottom: 0; } .context-info__image, .media-item__image { margin-right: 15px; margin-right: 15px; float: left; } .context-info__image img, .media-item__image img { width: auto; } .context-info__body, .media-item__body { overflow: hidden; margin-bottom: 0; } .context-info__body > :last-child, .media-item__body > :last-child { margin-bottom: 0; } /*------------------------------------ TRIANGLE http://davidtheclark.github.io/scut/#triangle */ /*------------------------------------ CSS3 Useful CSS3 tools Examples: @include calc(width, 100% - 30px, 90%); @include prefixer(box-shadow,1px 1px 1px red,webkit moz spec); */ /*------------------------------------ CALC Performs calculations with a fallback if necessary @include calc(width, 100% - 30px, 90%); */ /*------------------------------------ PREFIXER From: Bourbon Mixin Library @include prefixer([property),[value],[webkit|+|moz|+|ms|+|o|+|spec]); */ /*------------------------------------ DISPLAY Display tools Examples: @include display(inline-block) // In Old IE, this makes display:inline @include appearance(none) // Removes platform-native styling */ /*------------------------------------ # APPEARANCE The appearance CSS property is used to display an element using a platform-native styling based on the operating system's theme. @include appearance(none); */ /*------------------------------------ # DISPLAY Use new display types with more broadly supported equivalents as fallbacks @include display(flex) */ /*------------------------------------ EFFECTS 3D and special effects Examples: @include perspective(300px); @include perspective-origin(30% 30%); */ /*------------------------------------ PERSPECTIVE The perspective CSS property determines the distance between the z=0 plane and the user in order to give to the 3D-positioned element some perspective. The perspective-origin CSS property determines the position the viewer is looking at. It is used as the vanishing point by the perspective property. @include perspective(300px); @include perspective-origin(30% 30%); */ /*------------------------------------ SHADOWS */ /*------------------------------------ FORMS Consistent form inputs and buttons Examples: @include button(color(primary)); @include field; @include placeholder { color: red; } */ /*------------------------------------* BUTTON Button options and styles can be changed in _config.scss under the *Buttons*. Options include: $button-font-family $has-button-border $has-button-gradient $has-button-shadow $is-button-rounded /ref/patterns.php#buttons /*------------------------------------*/ input[type="submit"]:hover, .button:hover, .module--placeholder_button:hover, .area-picker-button:hover, .price-range-drop-down-arrow:hover, .standard-button:hover, .FavouriteItemAjax > div:hover, .RemovedPropertyAjaxToggle > div > a:hover, .refine-section .RemovedPropertyAjaxToggle > div > label:hover, .order-overview button.stripe-button-el span:hover, .search-area #no-script #search-button input[type="button"]:hover, input[type="submit"]:active, .button:active, .module--placeholder_button:active, .area-picker-button:active, .price-range-drop-down-arrow:active, .standard-button:active, .FavouriteItemAjax > div:active, .RemovedPropertyAjaxToggle > div > a:active, .refine-section .RemovedPropertyAjaxToggle > div > label:active, .order-overview button.stripe-button-el span:active, .search-area #no-script #search-button input[type="button"]:active { text-decoration: none; } input[type="submit"], .button, .module--placeholder_button, .area-picker-button, .price-range-drop-down-arrow, .standard-button, .button.contrast, .contrast.module--placeholder_button, .contrast.area-picker-button, .contrast.price-range-drop-down-arrow, .standard-button.contrast, .button.secondary, .secondary.module--placeholder_button, .secondary.area-picker-button, .secondary.price-range-drop-down-arrow, .standard-button.secondary, .button.facebook, .facebook.module--placeholder_button, .facebook.area-picker-button, .facebook.price-range-drop-down-arrow, .standard-button.facebook, .button.google, .google.module--placeholder_button, .google.area-picker-button, .google.price-range-drop-down-arrow, .standard-button.google, .FavouriteItemAjax > div, .RemovedPropertyAjaxToggle > div > a, .refine-section .RemovedPropertyAjaxToggle > div > label, .FavouriteItemAjax > div.saved, .order-overview button.stripe-button-el span, .search-area #no-script #search-button input[type="button"] { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; display: inline-block; vertical-align: baseline; padding-top: 0; padding-top: 0; padding-bottom: 0; padding-bottom: 0; padding-left: 15px; padding-left: 15px; padding-right: 15px; padding-right: 15px; cursor: pointer; font-family: sans-serif; line-height: 30px; min-height: 30px; white-space: nowrap; border: 1px solid; border-color: #ccc; border-radius: 4px; } input[disabled][type="submit"], [disabled].button, [disabled].module--placeholder_button, [disabled].area-picker-button, [disabled].price-range-drop-down-arrow, [disabled].standard-button, .FavouriteItemAjax > div[disabled], .RemovedPropertyAjaxToggle > div > a[disabled], .refine-section .RemovedPropertyAjaxToggle > div > label[disabled], .order-overview button.stripe-button-el span[disabled], .search-area #no-script #search-button input[disabled][type="button"] { -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0.1); box-shadow: 0 0 0 rgba(0, 0, 0, 0.1); cursor: not-allowed; opacity: 0.5; } /*------------------------------------ PLACEHOLDER Outputs vendor-prefixed placeholders for styling. Must be nested in a rule-set. input { width: 300px; @include placeholder { color: red; } } */ /*------------------------------------ IMAGES Consistent retina-display images Examples: @include hidpi { background-image:url(/imagepath_retina.jpg); } @include image-rendering (optimize-contrast) // Useful for sharper logos, but heavy on performance. @include retina-image(home-icon, 32px 20px) */ /*------------------------------------ # HIDPI Create specific styles for HiDPI @include hidpi { background-image:url(/imagepath_retina.jpg); } */ /*------------------------------------ # IMAGE-RENDERING */ /*------------------------------------ RETINA IMAGE The mixin is a helper to generate a retina background-image and non-retina background-image. The retina background-image will output to a hidpi media-query. The mixin uses a _2x.png retina filename by default. $filename will resolve a path to the image e.g. '../../home-icon'. For rails, you can use the asset-pipeline by passing true to the argument. @ retina-image($filename, $background-size, $extension*, $retina-filename*, $retina-suffix*, $asset-pipeline*) * = optional Argument Defaults - $extension: png - $retina-filename: null - $retina-suffix: _2x - $asset-pipeline: false */ /*------------------------------------ TYPOGRAPHY Control font settings and text layout with these tools Examples: @include columns(12 8em); @include column-rule(1px solid green); @include font-face(proxima-nova); @include font-features(liga kern frac); @include font-size(font-size(beta)) @include hide-text; @include legibility; @include link; @include table-borders(grid, 1px, solid, red) @include table-layout(fixed) @include table-rounded($base-radius) @include table-pattern(stripes) @include text-truncate(90%); */ /*------------------------------------ # COLUMNS Prefixed text column styles. Not supported in older browsers. Avoid shoehorning polyfills, instead content yourself with single-columns fallbacks */ /*------------------------------------ # FONT FACE Shorthand for including @font-face in your css. Remember also, Google fonts, Typekit have different approaches. Example: @include font-face(proxima-nova, /fonts/proxima-nova-bold-italic, bold, italic); Order of the includes matters, and it is: normal, bold, italic, bold+italic. */ /*------------------------------------ # FONT FEATURES Make the most of Opentype features http://clagnut.com/sandbox/css3/ */ /*------------------------------------ FONT-SIZE */ /*------------------------------------ # HIDE-TEXT Hide-text is an image replacement mixin. It is based off the HTML5-Boilerplate image-replacement. */ /*------------------------------------ LEGIBILITY */ /*------------------------------------ LINK */ .link, input.link { color: #2771c4; cursor: pointer; } .link:hover { color: #6fa5e2; } .link:visited { color: #3372b8; } .link:active { color: #2771c4; } /*------------------------------------ TABLES */ /*------------------------------------ LISTS Style lists of text or lists of items Examples: @include item-list(horizontal); @include list(clean); */ /*------------------------------------ LIST */ /*------------------------------------ LISTS */ /*------------------------------------* GRID SYSTEM Provides various methods used to lay out a page. All are based on fractional widths @include grid-row(); // Use on the parent of grid items @include grid-row-divs(n); // Creates a container for your grid items that ensures flush vertical edges to the outer container, or whatever container it's in. // Inserting a number (n) creates equal divisions of that amount @include grid-fraction(n, d) // A grid fraction. If you want to support old versions of IE, ensure you have an inner container with class .ie-inner /ref/patterns.php#grid /*------------------------------------*/ /** * See: http://css-tricks.com/make-sure-columns-dont-collapse-horizontally/ */ /** * Creates equal divisions of any given amount of items * Should be applied to the parent, will affect the direct children * * NOTE: this isn't designed to be used on it's own, use @include grid_row_div(n) instead */ /** * Used when content is not divided up into fractions */ /** * For setting the width of an element to be a fraction of the page. * e.g @include grid-fraction(2, 3) would use 2 thirds of the page. * * This also adds support for older versions of IE, * (this requires you using an inner container with class .ie-inner) */ /** * Used to contain a number of grid items, adds negative margins to the left and right */ /** * Used when you want to create equal divisions of the children * in your container. * By adding a number ($n) when including this in your css you * can split it's content into equal sections in the grid. */ /** * Used as the main container when setting the fixed with of a page * Generally good practice to have one of these per main section e.g. header, footer, main */ /*@mixin button( $button-color: #ccc ) { @include rounded($base-radius - 2, $base-radius - 2, $base-radius - 2 , $base-radius - 2 ); @include gradient( $button-color ); border:0px; color: $text-color; cursor: pointer; display: inline-block; font-size: $base-font-size + 2; line-height: $base-line-height; *margin-left: .3em; padding: $padding/2 $padding; text-align: center; font-weight: bold; text-decoration: none; font-family: $font-family; &:hover { @include gradient( darken( $button-color, 10% ) ); cursor: pointer; } $lightness: lightness( $button-color ); @if $lightness > 60 { color: $text-color; } @else { color: #fff; } }*/ /* Base stylesheets */ /*------------------------------------* BUTTONS /*------------------------------------*/ .primary-solid, .module-title, .secondary-solid, .search-list .Title, .search-list .Title:hover { color: white; padding: 5px; font-weight: bold; display: block; } #refine .module-title { border-radius: 5px 5px 0 0; padding: 15px; font-size: 1.2em; } table.intelligence { border: 1px solid #d6d6d6; margin-bottom: 15px; } table.intelligence .alternate td { background: white; } table.intelligence td { background: #efece5; border-right: 1px solid #d6d6d6; } table.intelligence td:first-child { border-left: 1px solid #d6d6d6; } .right-hero-button, #next-photo, .left-hero-button, #prev-photo { position: absolute; display: block; width: 20px; background: #D23722; color: white; bottom: 0; top: 0; text-decoration: none; text-align: center; z-index: 999; } .right-hero-button:hover, #next-photo:hover, .left-hero-button:hover, #prev-photo:hover { background: #bc311e; cursor: pointer; } .right-hero-button:before, #next-photo:before, .left-hero-button:before, #prev-photo:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .right-hero-button .ss-icon, #next-photo .ss-icon, .left-hero-button .ss-icon, #prev-photo .ss-icon, .right-hero-button .ui-dialog-titlebar-close, #next-photo .ui-dialog-titlebar-close, .left-hero-button .ui-dialog-titlebar-close, #prev-photo .ui-dialog-titlebar-close, .right-hero-button .close-icon, #next-photo .close-icon, .left-hero-button .close-icon, #prev-photo .close-icon, .right-hero-button .module__close, #next-photo .module__close, .left-hero-button .module__close, #prev-photo .module__close, .right-hero-button .area-picker li:after, .area-picker .right-hero-button li:after, #next-photo .area-picker li:after, .area-picker #next-photo li:after, .left-hero-button .area-picker li:after, .area-picker .left-hero-button li:after, #prev-photo .area-picker li:after, .area-picker #prev-photo li:after, .right-hero-button .recent-searches li:after, .recent-searches .right-hero-button li:after, #next-photo .recent-searches li:after, .recent-searches #next-photo li:after, .left-hero-button .recent-searches li:after, .recent-searches .left-hero-button li:after, #prev-photo .recent-searches li:after, .recent-searches #prev-photo li:after, .right-hero-button .recent-searches li:before, .recent-searches .right-hero-button li:before, #next-photo .recent-searches li:before, .recent-searches #next-photo li:before, .left-hero-button .recent-searches li:before, .recent-searches .left-hero-button li:before, #prev-photo .recent-searches li:before, .recent-searches #prev-photo li:before { display: inline-block; vertical-align: middle; } .right-hero-button, #next-photo { right: 0; border-radius: 0 5px 5px 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .right-hero-button, #next-photo { width: 22.5px; } } .right-hero-button[style], [style]#next-photo, .left-hero-button[style], [style]#prev-photo { height: auto !important; } .left-hero-button, #prev-photo { left: 0; border-radius: 5px 0 0 5px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .left-hero-button, #prev-photo { width: 22.5px; } } #prev-photo { background: rgba(0, 0, 0, 0.6); } #prev-photo:before { color: white; content: "\25C3"; font-family: 'SSStandard-web'; margin-top: 27px; } #prev-photo:hover { background: rgba(0, 0, 0, 0.8); } #next-photo { background: rgba(0, 0, 0, 0.6); } #next-photo:before { color: white; content: "\25B9"; font-family: 'SSStandard-web'; margin-top: 27px; } #next-photo:hover { background: rgba(0, 0, 0, 0.8); } #services .directory, #services .nationwide, #services .ni-housing-survey, #services .connect, #services .wilson-nesbitt, #services .map-search, #services .property-alerts, #services .iphone-app, #services .compare-ni { border: 1px solid #d6d6d6; padding: 15px; height: 169px; overflow: hidden; } #services .directory h3, #services .nationwide h3, #services .ni-housing-survey h3, #services .connect h3, #services .wilson-nesbitt h3, #services .map-search h3, #services .property-alerts h3, #services .iphone-app h3, #services .compare-ni h3 { font-size: 1.8em; } #services .directory img, #services .nationwide img, #services .ni-housing-survey img, #services .connect img, #services .wilson-nesbitt img, #services .map-search img, #services .property-alerts img, #services .iphone-app img, #services .compare-ni img { float: right; } /* BASE.SCSS - the main stylesheet ------------------------------------------------------------------ */ #top, #shell, #page, #content { margin: 0 auto; } #page { position: relative; } #top { background: #ebe7df; } #content { width: 1000px; min-height: 600px; } #content:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #content { width: 98%; min-height: 0px; } } .display-side-ads #content { min-height: 1520px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .display-side-ads #content { min-height: 600px; } } /* +Cookies ------------------------------------------------------------------------------------------- */ #cookie-warning-bar { background: #333; padding: 15px 0; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #cookie-warning-bar .span-10 { width: 74.4%; } #cookie-warning-bar .span-2 { width: 23.2%; } } /* +Styling */ .left-bracket { background: url("/images/pn-sprite.png") no-repeat scroll -162px -237px transparent; display: block; height: 38px; width: 227px; } .right-bracket { background: url("/images/pn-sprite.png") no-repeat scroll -175px -171px transparent; display: block; height: 38px; width: 227px; } .sticker { background: url("/images/pn-sprite.png") no-repeat scroll -17px -101px transparent; height: 90px; position: absolute; left: 50%; margin-left: 410px; top: 24px; width: 88px; z-index: 901; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .sticker { display: none; } } /* +Tabs ---------------------------------------------------------------------------------------------- */ #vertical-tabs-container { position: relative; background: white; } #vertical-tabs-container #tabs, #vertical-tabs-container .tabs-list { width: 200px; position: absolute; top: 0; bottom: 0; left: 0; border-right: 1px solid #d6d6d6; background: #f9f7f5; } #vertical-tabs-container #tabs .selected, #vertical-tabs-container #tabs .selected:hover, #vertical-tabs-container .tabs-list .selected, #vertical-tabs-container .tabs-list .selected:hover { background: white; margin-right: -1px; } #vertical-tabs-container #tabs .selected a, #vertical-tabs-container #tabs .selected .refine-section label, .refine-section #vertical-tabs-container #tabs .selected label, #vertical-tabs-container #tabs .selected:hover a, #vertical-tabs-container #tabs .selected:hover .refine-section label, .refine-section #vertical-tabs-container #tabs .selected:hover label, #vertical-tabs-container .tabs-list .selected a, #vertical-tabs-container .tabs-list .selected .refine-section label, .refine-section #vertical-tabs-container .tabs-list .selected label, #vertical-tabs-container .tabs-list .selected:hover a, #vertical-tabs-container .tabs-list .selected:hover .refine-section label, .refine-section #vertical-tabs-container .tabs-list .selected:hover label { color: #333; } #vertical-tabs-container #tabs li, #vertical-tabs-container .tabs-list li { border-bottom: 1px solid #d6d6d6; border-top: 0; padding: 15px; } #vertical-tabs-container #tabs li:hover, #vertical-tabs-container .tabs-list li:hover { background: #efece5; } #vertical-tabs-container #tabs a, #vertical-tabs-container #tabs .refine-section label, .refine-section #vertical-tabs-container #tabs label, #vertical-tabs-container .tabs-list a, #vertical-tabs-container .tabs-list .refine-section label, .refine-section #vertical-tabs-container .tabs-list label { display: block; color: #A3A3A3; text-decoration: none; } #vertical-tabs-container .panel { min-height: 200px; padding: 30px 30px 30px 230px; } #vertical-tabs-container .panel li.download-list-item { padding: 10px; } #vertical-tabs-container .panel li.download-list-item a:first-child:before, #vertical-tabs-container .panel li.download-list-item .refine-section label:first-child:before, .refine-section #vertical-tabs-container .panel li.download-list-item label:first-child:before { color: #333; float: left; font-family: 'SSStandard-web'; font-size: 1.4em; margin-right: 15px; margin-bottom: -4px; } #vertical-tabs-container .panel li.download-list-item.site-map a:first-child:before, #vertical-tabs-container .panel li.download-list-item.site-map .refine-section label:first-child:before, .refine-section #vertical-tabs-container .panel li.download-list-item.site-map label:first-child:before, #vertical-tabs-container .panel li.download-list-item.location-map a:first-child:before, #vertical-tabs-container .panel li.download-list-item.location-map .refine-section label:first-child:before, .refine-section #vertical-tabs-container .panel li.download-list-item.location-map label:first-child:before { content: "\E673"; } @media only screen and (max-width: 48em) { #vertical-tabs-container { border-bottom: 1px solid #d6d6d6; } #vertical-tabs-container #tabs { width: 100%; position: static; border-bottom: 1px solid #d6d6d6; height: 36px; } #vertical-tabs-container #tabs.large { font-size: 1.2em; } #vertical-tabs-container #tabs li { float: left; border: 0px; border-right: 1px solid #d6d6d6; padding: 7.5px 10px; } #vertical-tabs-container .panel { padding: 30px; } } /* +Tags ---------------------------------------------------------------------------------------------- */ .tag { background: #D23722; position: absolute; padding: 3.75px; color: white; text-transform: uppercase; font-size: 11px; left: 0; top: 0; } .tag.green { background: #259911; } .tag.blue { background: #075AA6; } .tag.featured { background: #F8BB4E; } .property-image .tag { left: 4px; top: 4px; line-height: 12px; } /* +Tables ------------------------------------------------------------------------------------------ */ table { width: 100%; } table td { border-top: 1px solid #d6d6d6; padding: 7.5px; } table th { text-align: left; } table tr:first-child td { border-top: none; } table.layout { margin: 0; padding: 0; } table.layout td { padding: 0; margin: 0; } table.list-table { border-bottom: 1px solid #d6d6d6; margin-bottom: 2.4%; } table.list-table th { padding-bottom: 15px; } table.list-table td { padding: 15px 0; } table .label { font-weight: bold; } /* SEO ---------------------------------------------------------------------------------------------- */ .seo { background: #f5f3ef; padding: 15px 0; border-top: 1px solid #fffffe; } .seo .first a, .seo .first .refine-section label, .refine-section .seo .first label { color: #D23722; font-weight: bold; } .browse-areas-content a, .browse-areas-content .refine-section label, .refine-section .browse-areas-content label { color: #A3A3A3; text-decoration: none; } /* Feedback ------------------------------------------------------------------------------------------- */ @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .feedback-page .module.mpu, .feedback-page .mpu.member--count { display: none; } } /* +Advertise with propertynews ---------------------------------------------------------------------- */ .advertise-feature { position: relative; margin-left: 25px; padding-left: 40px; } .advertise-feature .details { margin-left: 35px; } .advertise-feature-icon { border-radius: 100px 100px 100px 100px; width: 50px; height: 50px; background: #D23722; line-height: 55px; font-size: 24px; font-weight: normal; position: absolute; left: -12px; top: 50%; margin-top: -25px; } /* +New Homes Homepage ------------------------------------------------------------------------------ */ #new-dev-featured-slides { position: relative; } #new-dev-featured-slides .slide { float: left; width: 970px; } #new-dev-featured-slides .slide img { max-width: 970px; } #new-dev-featured-slides-wrapper { height: 200px; overflow: hidden; } /* +Footer ------------------------------------------------------------------------------------------- */ #footer { background: white; padding: 15px 0 7.5px 0; border-top: 1px solid #d6d6d6; -webkit-box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.1); } #footer-logo { text-align: center; } #propertynews-footer-logo { width: 70%; margin: 0 auto; } #inm-strip { padding: 7.5px 0 40px 0; background: white; border-top: 1px solid #d6d6d6; } #inm-strip .inm-icon { background: url("/images/pn-sprite.png") no-repeat scroll -105px -21px transparent; padding: 3px 5px 0 0px; width: 67px; height: 17px; float: left; margin: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #inm-strip .inm-icon { display: none; } } #inm-strip .icon { background: url("/images/pn-sprite.png") no-repeat scroll transparent; display: block; float: left; height: 16px; width: 18px; margin-right: 1px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #inm-strip .icon { display: none; } } #inm-strip .beltelfav { background-position: -105px -2px; } #inm-strip .carsfav { background-position: -124px -2px; } #inm-strip .nijobsfav { background-position: -143px -2px; } #inm-strip .adsfav { background-position: -181px -2px; } #inm-strip .grabonefav { background-position: -162px -2px; } /* Adverts ------------------------------------------------------------------------------------------- */ .side-ad { display: none; } .display-side-ads .side-ad { width: 120px; height: 1500px; position: absolute; overflow: hidden; display: block; } .display-side-ads .side-ad .advert { display: block; } .display-side-ads .side-ad.left-wing { margin-left: -140px; } .display-side-ads .side-ad.right-wing { margin-left: 1020px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .display-side-ads .side-ad { display: none; } } /* +sitemap ------------------------------------------------------------------------------------------- */ #sitemap .section { padding-bottom: 30px; } /* Advertise ------------------------------------------------------------------------------------------- */ .image-label-with-description img, .component-Image.width-sensitive img { max-width: 100%; } /* About ------------------------------------------------------------------------------------------- */ .about .about-intro { background: #f8f7f5; padding: 7.5px; } .about .component-MarkDown { text-align: center; } .about .component-MarkDown h1 { font-size: 1.6em; } /* Sitemap ------------------------------------------------------------------------------------------- */ #sitemap .section { padding: 20px 0; border-top: 1px solid #DDD; } #sitemap .section ul { margin-bottom: 20px; } /* Connect with us ------------------------------------------------------------------------------------------- */ #connect img { max-width: 100%; } /* Beta website styles ------------------------------------------------------------------------------------------- */ @media (min-width: 988px) { .banner-container { display: -webkit-box; display: -ms-flexbox; display: flex; } } .banner { color: white; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .banner a, .banner .refine-section label, .refine-section .banner label { color: white; } .banner p { line-height: 50px; text-align: center; font-weight: bold; font-size: 1.1em; margin-bottom: 0px; } .banner--beta { background: #1051b2; } .banner--blog { background: #62b6ff; position: absolute; top: -50px; left: 0; right: 0; display: none; } .blog .banner--blog { display: block; } /* Blocks */ /*------------------------------------* ALERT Use these classes to display alert messages /*------------------------------------*/ .alert, .alert--error, .alert--success { padding: 7.5px; background: white; border: 1px solid #f0efef; border-radius: 5px; color: #a3a3a3; position: relative; } .alert--error { border-color: #f6cfca; color: #D23722; padding-left: 30px; background: #fdf6f6; } .alert--error:before { content: '␡'; font-family: "SSStandard-web"; position: absolute; top: 7.5px; left: 7.5px; padding: 2px; } .alert--success { border-color: #94e594; color: forestgreen; padding-left: 30px; background: #e6f9e6; } .alert--success:before { content: '✓'; font-family: "SSStandard-web"; position: absolute; top: 7.5px; left: 7.5px; padding: 2px; } /* Agent Directory ---------------------------------------------------------------------------------------- */ .ribbon { background-size: 200px 30px; color: white; height: 29px; width: 158px; font-weight: bold; text-transform: uppercase; display: none; } .ribbon span { display: block; padding: 8px 12px; } .ribbon.-blue { background: url("/images/blue-ribbon-tag.svg") right center; } .ribbon.-yellow { background: url("/images/yellow-ribbon-tag.svg") right center; } .agent-directory .selections a, .agent-directory .selections .refine-section label, .refine-section .agent-directory .selections label { margin-right: 5px; } .agent-directory #brochure-captcha { float: left; margin-right: 2px; } .agent-directory #recaptcha_image[style] { width: 100% !important; margin-bottom: 15px; } .agent-directory #recaptcha_challenge_image { width: 100% !important; margin-bottom: 15px; } .agent-directory .results { padding: 14px 14px 0 0; border-right: 1px solid #d6d6d6; margin: -15px -10px -15px 0; } .agent-directory .result { padding-left: 48px; margin-right: -14px; margin-left: -15px; } .agent-directory .result:last-child { margin-bottom: 15px; border-bottom: 1px solid #d6d6d6; } .agent-directory .result .ribbon { margin: -5px 0 10px -50px; } .agent-directory .result .check { position: absolute; left: 18px; } .agent-directory .result .agent-logo { max-width: 75px; width: auto; } .agent-directory .result.selected { border-top: none; background: #e5edf3; padding: 0; margin-right: -15px; margin-left: -16px; } .agent-directory .result.selected .result-inner { border: 1px solid #82AFE7; padding: 22.5px; padding-left: 48px; } .agent-directory .result.promo { border: none !important; margin-right: -15px; margin-left: -16px; margin-top: 0; padding: 0; } .agent-directory .result.promo .result-inner { border: 1px solid #F8BB4E; min-height: 0; padding: 22.5px; padding-left: 48px; } .agent-directory .result.promo .ribbon.-yellow { display: block; } .agent-directory .result.promo.selected .result-inner { border: 1px solid #82AFE7; background: #e5edf3; } .agent-directory .result.promo.selected .ribbon.-blue { display: block; } .agent-directory .result.promo.selected .ribbon.-yellow { display: none; } .agent-directory .selections a, .agent-directory .selections .refine-section label, .refine-section .agent-directory .selections label { margin-right: 5px; } .promo + .result, .selected + .result, .promo + .result.promo .result-inner, .promo + .result.selected .result-inner, .selected + .result.promo .result-inner, .selected + .result.selected .result-inner, .promo + .result.selected.promo .result-inner, .selected + .result.selected.promo .result-inner { border-top: none; } .promo + .result.selected .result-inner { border-top: 1px solid #82AFE7; } .selected-options { display: none; } #contact-agent .input-group label, .contact-form label { display: none; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .agent-directory .results { margin: -12px -10px -12px 0; } } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .agent-directory .result, .agent-directory .result.selected, .agent-directory .result.promo { margin-left: -12px; margin-right: -14px; } .agent-directory #contact-agent-form .input-group input { font-size: 1.2em; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .directory-right, #directory-results { width: auto; float: none; margin-right: 0; } .agent-directory .results { border-right: none; padding: 12px; } .agent-directory .result, .agent-directory .result.selected, .agent-directory .result.promo { margin-left: -24px; margin-right: -14px; } .agent-directory .buttons, .agent-directory .remember { text-align: left !important; } .agent-directory .directory-refine { display: none; } } /* BROCHURE.SCSS ---------------------------------------------------------------------------------- */ #brochure { position: relative; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #brochure .brochure-left, #brochure .brochure-right, #brochure .span-8, #brochure .span-4, #brochure .grid .result, .grid #brochure .result { width: 100%; } #brochure #mpu { float: left; margin-right: 2.4%; width: 44.8%; height: 283px; } #brochure .span-4 img, #brochure .grid .result img, .grid #brochure .result img { float: left; } #brochure #facebook-module { float: right; width: 44.8%; } #brochure #sky-ads { display: none; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #brochure .module.see-also .col, #brochure .see-also.member--count .col, #brochure .module.see-also .grid .result, .grid #brochure .module.see-also .result, #brochure .see-also.member--count .grid .result, .grid #brochure .see-also.member--count .result { float: none; } #brochure .module.see-also .span-4 li, #brochure .see-also.member--count .span-4 li, #brochure .module.see-also .grid .result li, .grid #brochure .module.see-also .result li, #brochure .see-also.member--count .grid .result li, .grid #brochure .see-also.member--count .result li { float: left; width: 100%; margin-right: 2.4%; width: 40.2666666667%; } } #brochure #actions { margin-bottom: 15px; position: relative; } #brochure #actions .action-buttons { float: left; } @media only screen and (max-width: 48em) { #brochure #actions .action-buttons { float: none; text-align: center; } } #brochure #actions .print { line-height: 33px; margin-left: 15px; } #brochure #actions .print .standard-icon { font-size: 10px; } #brochure #actions .contact-agent { display: none; } #brochure #actions .social-sharing { float: right; } #brochure #actions .social-sharing li { width: 80px; } @media only screen and (max-width: 48em) { #brochure #actions .social-sharing { float: none; text-align: center; margin-bottom: 15px; } } .feesapply { position: relative; top: -3px; } .see-also:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } #brochure-nav-options { margin-bottom: 15px; } #brochure-nav-options a, #brochure-nav-options .refine-section label, .refine-section #brochure-nav-options label { padding: 7.5px; } #brochure #slideshow { height: 498px; } #brochure .slide-wrapper { background-color: #ebebeb; height: 400px; margin-bottom: 15px; } #brochure .slide-wrapper .slide { width: 637px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #brochure .slide-wrapper .slide { width: 630px; } } #brochure .slides { text-align: center; line-height: 400px; margin-bottom: 15px; position: relative; } #brochure .slides .slide { height: 400px; } #brochure .slides img { height: 100%; } #brochure .thumbs { position: relative; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #brochure .thumbs { width: 638px; margin: 0 auto; } } #thumb-slider, #thumb-slider-main { overflow: hidden; border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; width: 638px; height: 63px; } #thumb-slider img, #thumb-slider-main img { height: 63px; } #thumb-slider img:hover, #thumb-slider-main img:hover { cursor: pointer; } #thumb-slider ul, #thumb-slider-main ul { width: 9999px; position: relative; margin-bottom: 0; } #thumb-slider li, #thumb-slider-main li { float: left; margin-right: 2px; } #prev-photo { border-radius: 0; } #next-photo { border-radius: 0; } #key-information-table .feesapply { float: right; top: 0; } #brochure #features ul { list-style-type: disc; } #brochure #features ul li { margin-left: 15px; margin-bottom: 5px; } #brochure #features, #brochure #description, #brochure #comprises { margin-bottom: 30px; } #brochure #location { border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; margin: 0 -15px; padding: 15px; border-bottom: 0; padding-bottom: 0; } #brochure #location .ss-icon, #brochure #location .ui-dialog-titlebar-close, #brochure #location .close-icon, #brochure #location .module__close, #brochure #location .area-picker li:after, .area-picker #brochure #location li:after, #brochure #location .recent-searches li:after, .recent-searches #brochure #location li:after, #brochure #location .recent-searches li:before, .recent-searches #brochure #location li:before { font-size: 18px; padding-right: 5px; text-decoration: none; } #brochure #location .streetview { text-decoration: none; } #brochure #location .streetview .link { text-decoration: underline; } #brochure #location .streetview .link:hover { text-decoration: none; } #brochure #location .streetview .ss-icon, #brochure #location .streetview .ui-dialog-titlebar-close, #brochure #location .streetview .close-icon, #brochure #location .streetview .module__close, #brochure #location .streetview .area-picker li:after, .area-picker #brochure #location .streetview li:after, #brochure #location .streetview .recent-searches li:after, .recent-searches #brochure #location .streetview li:after, #brochure #location .streetview .recent-searches li:before, .recent-searches #brochure #location .streetview li:before { color: #F5D010; } #brochure #location .larger { color: #2E8EB9; } #brochure #google-map { margin-right: 15px; float: left; } #brochure #map-link { margin-right: 15px; } #propertynews-services .service { border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; margin: 0 -15px; padding: 15px; border-bottom: 0; } #propertynews-services .service:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } @media only screen and (max-width: 48em) { #propertynews-services .service { border: 0; width: 50%; float: left; margin: 0px; padding: 0px; } #propertynews-services .service .details { padding: 15px; } } #propertynews-services .service-image-link { float: left; width: 100%; margin-right: 2.4%; width: 14.6666666667%; } #propertynews-services .service-image-link img { width: 100%; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #propertynews-services .service-image-link { max-height: 70px; } } #propertynews-services .details { padding-left: 17.0666666667%; } #similar-properties { width: auto; margin-bottom: 15px; } .agents-other-properties .property-image { height: 37px; font: 0/0 a; } .agents-other-properties .property-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .agents-other-properties .property-image > * { font: 11px sans-serif; } .agents-other-properties .property-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .agents-other-properties { width: 68%; margin: 0 auto; } #no-properties-found .agents-other-properties .result--thumbnail { width: 20%; float: left; } #no-properties-found .agents-other-properties .result__details { display: block; clear: both; width: auto; text-align: left; margin-right: 15px; } #contact-agent-form { background: none; border: 0; margin-bottom: 15px; } #contact-agent-form input[type="text"], #contact-agent-form textarea, #contact-agent-form input[type="email"], #contact-agent-form input[type="tel"] { width: 90%; font-family: Helvetica, sans-serif; } #contact-agent-form .remember { float: left; } #contact-agent-form .remember label { font-weight: normal; display: inline-block; } #contact-agent-form .buttons { text-align: left; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #contact-agent-form .buttons { margin-left: 15px; } } #agent-details { padding: 15px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #brochure .span-4 .agent-logo img, #brochure .grid .result .agent-logo img, .grid #brochure .result .agent-logo img { float: none; margin-bottom: 15px; } .brochure-right #contact-agent { margin-top: 12px; background: #e5edf3; } .brochure-right #agent-details { float: right; width: 50%; border-bottom: 0; padding: 30px 0 15px 0; } .brochure-right #contact-agent-form { float: left; width: 50%; padding: 15px 0; } .brochure-right #contact-agent-form .input-group { padding: 5px 15px; } .brochure-right .contact-info { clear: both; padding: 15px; border-top: 1px solid white; } .brochure-right .contact-agent-simple { display: none; } } .contact-info li { padding: 15px 7.5px; } .contact-info li .ss-icon, .contact-info li .ui-dialog-titlebar-close, .contact-info li .close-icon, .contact-info li .module__close, .contact-info li .area-picker li:after, .area-picker .contact-info li li:after, .contact-info li .recent-searches li:after, .recent-searches .contact-info li li:after, .contact-info li .recent-searches li:before, .recent-searches .contact-info li li:before { display: inline-block; margin-right: 7.5px; vertical-align: top; } .contact-info li a, .contact-info li .refine-section label, .refine-section .contact-info li label { display: inline-block; width: 92%; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .contact-info li a, .contact-info li .refine-section label, .refine-section .contact-info li label { width: 90%; } } .contact-info .address { margin-left: 23px; } #mortgage-calculator-module { background-repeat: no-repeat; background-color: white; background-position: bottom; padding: 15px; margin: 0 0 15px 0; margin-bottom: 0; min-height: 228px; position: relative; } #mortgage-calculator-module .calculator-image { position: absolute; bottom: 60px; } #mortgage-calculator-module input[type="text"] { width: 50%; } #mortgage-calculator-module .terms { margin-top: 15px; } #mortgage-calculator-module table { margin-bottom: 15px; } #mortgage-calculator-module label { color: #333; } #mortgage-calculator-module .years { font-weight: bold; margin-left: 3.75px; color: #333; } #mortgage-calculator-module .button, #mortgage-calculator-module .module--placeholder_button, #mortgage-calculator-module .area-picker-button, #mortgage-calculator-module .price-range-drop-down-arrow { font-size: 15px; display: block; width: 100%; background: #075ca7; border: none; color: white; padding: 7.5px 0; } #calculator .terms { font-size: 10px; color: #333; width: 60%; } .calculator-margin { margin-top: 2.4%; } #calculation-results { background: white; border: 1px solid #d6d6d6; margin-bottom: 15px; } #calculation-results h4 { font-size: 0.9em; color: #075ca7; display: inline-block; vertical-align: top; margin-right: 7.5px; } #calculation-results p { font-size: 2em; font-weight: bold; } .calculation-result-currency h4 { font-size: 0.9em; color: #cb721f !important; display: inline-block; vertical-align: top; margin-right: 7.5px; } .button-currency { background: #cb721f !important; color: white !important; border: 1px solid #cb721f !important; } .agent-details-module .agent-logo img { width: 100%; margin-bottom: 3px; } .contact-agent .module-title { background: #075ca7; } #large-slideshow-mortgage { text-align: left; } #large-slideshow-mortgage #term { margin-right: 7.5px; } #property-stats-image { width: 100%; } #brochure .intelligence-actions .contact-agent-text { text-align: right; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #brochure .intelligence-actions .span-4, #brochure .intelligence-actions .grid .result, .grid #brochure .intelligence-actions .result { width: 31.7333333333%; } #brochure .intelligence-actions .span-8 { width: 65.8666666667%; } } #comprises table tr td, #comprises table tr th { vertical-align: top; border: 0px; } #comprises table tr td.name, #comprises table tr th.name { border-right: 1px solid #ccc; text-align: right; font-weight: bold; } #comprises table tr td.desc, #comprises table tr th.desc { min-width: 200px; } #comprises table tr.alternate td { background: #f9f7f5; } #contact-agent input#term { margin-right: 7.5px; } #contact-agent .input-group.remember { text-align: left; } #controls .streetview .ss-icon, #controls .streetview .ui-dialog-titlebar-close, #controls .streetview .close-icon, #controls .streetview .module__close, #controls .streetview .area-picker li:after, .area-picker #controls .streetview li:after, #controls .streetview .recent-searches li:after, .recent-searches #controls .streetview li:after, #controls .streetview .recent-searches li:before, .recent-searches #controls .streetview li:before { color: #333; text-decoration: none; } #PgJqueryDialog-SendToFriend .small-text { color: #A3A3A3; } #PgJqueryDialog-SendToFriend .cancel { margin-left: 30px; } #PgJqueryDialog-SendToFriend .input-group:nth-child(2) p { margin-top: 5px; } .agent-logos img { margin-left: 4px; } /* ----------------------------- Property Notes ----------------------------- */ #edit-property-note-link, #remove-property-note-link { position: absolute; padding-top: 9px; padding-top: 9px; padding-bottom: 9px; padding-bottom: 9px; padding-left: 8px; padding-left: 8px; padding-right: 8px; padding-right: 8px; right: 29px; border-left: 1px solid #e5e0d6; top: 0; bottom: 0; } #edit-property-note-link { right: 29px; color: #A3A3A3; } #property-note-save { float: right; } #property-note-cancel { float: left; } #remove-property-note-link { right: 0; } #property-note-popup { position: absolute; z-index: 999; } #PropertyNoteText { min-height: 50px; } #PropertyNoteTextBoxPicker .actions { display: none; } #PropertyNoteTextBoxPicker.has-note .buttons, #PropertyNoteTextBoxPicker.has-note .title { display: none; } #PropertyNoteTextBoxPicker.has-note .actions { display: block; } #PropertyNoteTextBoxPicker.has-note .alternate-module { padding: 7px 0 7px 10px; border: 0; } #PropertyNoteTextBoxPicker.has-note .property-note-display { max-width: 220px; padding-right: 68px; overflow: hidden; height: 20px; } #sky-ads { min-height: 630px; } .letting-fees-dialog ul { list-style: disc; padding-left: 20px; margin-bottom: 1em; } .letting-fees-dialog ul li { margin-bottom: 4px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #brochure .bottom-footer, #brochure #sky-ads { display: none; } } #brochure #sky1 { float: left; } #brochure #sky2 { float: right; } .letting-fees-dialog h2 { display: none; } .img-full { width: 100%; } .custom-ad { display: block; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .custom-ad { width: 50%; margin: 15px auto; margin-top: 0; float: none !important; } } /* Captcha Validation Changes */ .captcha-error .error-placeholder { display: none !important; } .captcha-container { -webkit-transform: scale(0.9); transform: scale(0.9); -webkit-transform-origin: 0 0; transform-origin: 0 0; float: left; } .currency-conversion-dialog .half { float: left; width: 50%; } .currency-conversion-dialog .calc-logo { max-width: 100px; padding-left: 7.5px; } .currency-conversion-dialog table { margin-top: 2.4%; } .currency-conversion-dialog .title-m { display: none; } .currency-conversion-dialog .button, .currency-conversion-dialog .module--placeholder_button, .currency-conversion-dialog .area-picker-button, .currency-conversion-dialog .price-range-drop-down-arrow { font-size: 12px; } .currency-container { padding-top: 15px; } .currency-container .currency-list { list-style: disc !important; margin: 2.4% !important; } .makeover { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; background: white; padding: 60px 45px !important; } .new-brand__button { padding-top: 0; padding-top: 0; padding-bottom: 0; padding-bottom: 0; padding-left: 15px; padding-left: 15px; padding-right: 15px; padding-right: 15px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; background: #f41b48; color: #fff; -moz-appearance: none; appearance: none; cursor: pointer; display: inline-block; line-height: 42px; min-height: 46px; white-space: nowrap; -webkit-appearance: none; outline: 0; font-weight: 700; font-size: 17px; border-radius: 4px; border: 1px solid #ea0b3a; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-decoration: none; margin: 2.4% 0; } .new-brand__header { font-size: 34px; } .new-brand__subtext { font-weight: normal; line-height: 1.5; width: 70%; margin: 0 auto 16px auto; font-size: 16px; } .new-brand__header-image { width: 50% !important; display: block; margin: 32px auto; } .new-brand__video { margin-bottom: 32px; } /*------------------------------------* BUTTONS /*------------------------------------*/ input[type="submit"] { -webkit-appearance: none; border: none; background: #ccc; border-color: #ccc; color: #4d4c4c; font-weight: bold; text-decoration: none; text-align: center; font-size: 12px; margin: 0; } input[type="submit"]:visited { color: #4d4c4c; } input[type="submit"]:hover { background: #bfbfbf; color: #333333; } input[type="submit"]:active { background: #b3b2b2; color: #1a1919; } input[type="submit"][disabled] { background: #ccc; } input[type="submit"][disabled]:hover, input[type="submit"][disabled]:active { background: #ccc; } .button, .module--placeholder_button, .area-picker-button, .price-range-drop-down-arrow, .standard-button { background: #ccc; border-color: #ccc; color: #4d4c4c; font-weight: bold; text-decoration: none; text-align: center; } .button:visited, .module--placeholder_button:visited, .area-picker-button:visited, .price-range-drop-down-arrow:visited, .standard-button:visited { color: #4d4c4c; } .button:hover, .module--placeholder_button:hover, .area-picker-button:hover, .price-range-drop-down-arrow:hover, .standard-button:hover { background: #bfbfbf; color: #333333; } .button:active, .module--placeholder_button:active, .area-picker-button:active, .price-range-drop-down-arrow:active, .standard-button:active { background: #b3b2b2; color: #1a1919; } .button[disabled], [disabled].module--placeholder_button, [disabled].area-picker-button, [disabled].price-range-drop-down-arrow, .standard-button[disabled] { background: #ccc; } .button[disabled]:hover, [disabled].module--placeholder_button:hover, [disabled].area-picker-button:hover, [disabled].price-range-drop-down-arrow:hover, .button[disabled]:active, [disabled].module--placeholder_button:active, [disabled].area-picker-button:active, [disabled].price-range-drop-down-arrow:active, .standard-button[disabled]:hover, .standard-button[disabled]:active { background: #ccc; } .button.square, .square.module--placeholder_button, .area-picker-button, .price-range-drop-down-arrow, .standard-button.square, .standard-button.area-picker-button, .standard-button.price-range-drop-down-arrow { border-radius: 0; } .button.contrast, .contrast.module--placeholder_button, .contrast.area-picker-button, .contrast.price-range-drop-down-arrow, .standard-button.contrast { background: #D23722; border-color: #D23722; color: white; } .button.contrast:visited, .contrast.module--placeholder_button:visited, .contrast.area-picker-button:visited, .contrast.price-range-drop-down-arrow:visited, .standard-button.contrast:visited { color: white; } .button.contrast:hover, .contrast.module--placeholder_button:hover, .contrast.area-picker-button:hover, .contrast.price-range-drop-down-arrow:hover, .standard-button.contrast:hover { background: #bc311e; color: white; } .button.contrast:active, .contrast.module--placeholder_button:active, .contrast.area-picker-button:active, .contrast.price-range-drop-down-arrow:active, .standard-button.contrast:active { background: #a62c1b; color: white; } .button.contrast[disabled], .contrast[disabled].module--placeholder_button, .contrast[disabled].area-picker-button, .contrast[disabled].price-range-drop-down-arrow, .standard-button.contrast[disabled] { background: #D23722; } .button.contrast[disabled]:hover, .contrast[disabled].module--placeholder_button:hover, .contrast[disabled].area-picker-button:hover, .contrast[disabled].price-range-drop-down-arrow:hover, .button.contrast[disabled]:active, .contrast[disabled].module--placeholder_button:active, .contrast[disabled].area-picker-button:active, .contrast[disabled].price-range-drop-down-arrow:active, .standard-button.contrast[disabled]:hover, .standard-button.contrast[disabled]:active { background: #D23722; } .button.secondary, .secondary.module--placeholder_button, .secondary.area-picker-button, .secondary.price-range-drop-down-arrow, .standard-button.secondary { background: #075ca7; border-color: #075ca7; color: white; } .button.secondary:visited, .secondary.module--placeholder_button:visited, .secondary.area-picker-button:visited, .secondary.price-range-drop-down-arrow:visited, .standard-button.secondary:visited { color: white; } .button.secondary:hover, .secondary.module--placeholder_button:hover, .secondary.area-picker-button:hover, .secondary.price-range-drop-down-arrow:hover, .standard-button.secondary:hover { background: #064f8f; color: white; } .button.secondary:active, .secondary.module--placeholder_button:active, .secondary.area-picker-button:active, .secondary.price-range-drop-down-arrow:active, .standard-button.secondary:active { background: #054176; color: white; } .button.secondary[disabled], .secondary[disabled].module--placeholder_button, .secondary[disabled].area-picker-button, .secondary[disabled].price-range-drop-down-arrow, .standard-button.secondary[disabled] { background: #075ca7; } .button.secondary[disabled]:hover, .secondary[disabled].module--placeholder_button:hover, .secondary[disabled].area-picker-button:hover, .secondary[disabled].price-range-drop-down-arrow:hover, .button.secondary[disabled]:active, .secondary[disabled].module--placeholder_button:active, .secondary[disabled].area-picker-button:active, .secondary[disabled].price-range-drop-down-arrow:active, .standard-button.secondary[disabled]:hover, .standard-button.secondary[disabled]:active { background: #075ca7; } .button.small, .small.module--placeholder_button, .small.area-picker-button, .small.price-range-drop-down-arrow, .standard-button.small { font-size: 12px; padding: 0 7.5px; } .button.tiny, .tiny.module--placeholder_button, .tiny.area-picker-button, .tiny.price-range-drop-down-arrow, .standard-button.tiny { font-size: 12px; padding: 0 5px; line-height: 10px; min-height: 26px; } .button.large, .large.module--placeholder_button, .large.area-picker-button, .large.price-range-drop-down-arrow, .standard-button.large { font-size: 24px; } .button.bordered, .bordered.module--placeholder_button, .bordered.area-picker-button, .bordered.price-range-drop-down-arrow, .standard-button.bordered { background-image: none; border: 1px solid #d6d6d6; -webkit-box-shadow: 1px 1px 3px #ddd; box-shadow: 1px 1px 3px #ddd; font-weight: normal; } .button.agent, .agent.module--placeholder_button, .agent.area-picker-button, .agent.price-range-drop-down-arrow, .standard-button.agent { padding: 7.5px 30px; font-size: 14.4px; white-space: normal; } .button.favourited, .favourited.module--placeholder_button, .favourited.area-picker-button, .favourited.price-range-drop-down-arrow, .standard-button.favourited { background: #edca07; border-color: #edca07; color: white; } .button.inactive, .inactive.module--placeholder_button, .inactive.area-picker-button, .inactive.price-range-drop-down-arrow, .standard-button.inactive { background: #e1dbcf; cursor: auto; opacity: 0.4; } .button.facebook, .facebook.module--placeholder_button, .facebook.area-picker-button, .facebook.price-range-drop-down-arrow, .standard-button.facebook { background: #4b63a6; border-color: #4b63a6; color: white; } .button.facebook:visited, .facebook.module--placeholder_button:visited, .facebook.area-picker-button:visited, .facebook.price-range-drop-down-arrow:visited, .standard-button.facebook:visited { color: white; } .button.facebook:hover, .facebook.module--placeholder_button:hover, .facebook.area-picker-button:hover, .facebook.price-range-drop-down-arrow:hover, .standard-button.facebook:hover { background: #435994; color: white; } .button.facebook:active, .facebook.module--placeholder_button:active, .facebook.area-picker-button:active, .facebook.price-range-drop-down-arrow:active, .standard-button.facebook:active { background: #3b4e83; color: white; } .button.facebook[disabled], .facebook[disabled].module--placeholder_button, .facebook[disabled].area-picker-button, .facebook[disabled].price-range-drop-down-arrow, .standard-button.facebook[disabled] { background: #4b63a6; } .button.facebook[disabled]:hover, .facebook[disabled].module--placeholder_button:hover, .facebook[disabled].area-picker-button:hover, .facebook[disabled].price-range-drop-down-arrow:hover, .button.facebook[disabled]:active, .facebook[disabled].module--placeholder_button:active, .facebook[disabled].area-picker-button:active, .facebook[disabled].price-range-drop-down-arrow:active, .standard-button.facebook[disabled]:hover, .standard-button.facebook[disabled]:active { background: #4b63a6; } .button.google, .google.module--placeholder_button, .google.area-picker-button, .google.price-range-drop-down-arrow, .standard-button.google { background: #577df3; border-color: #577df3; color: #051546; color: white; } .button.google:visited, .google.module--placeholder_button:visited, .google.area-picker-button:visited, .google.price-range-drop-down-arrow:visited, .standard-button.google:visited { color: #051546; } .button.google:hover, .google.module--placeholder_button:hover, .google.area-picker-button:hover, .google.price-range-drop-down-arrow:hover, .standard-button.google:hover { background: #3f6bf1; color: #020716; } .button.google:active, .google.module--placeholder_button:active, .google.area-picker-button:active, .google.price-range-drop-down-arrow:active, .standard-button.google:active { background: #2758f0; color: black; } .button.google[disabled], .google[disabled].module--placeholder_button, .google[disabled].area-picker-button, .google[disabled].price-range-drop-down-arrow, .standard-button.google[disabled] { background: #577df3; } .button.google[disabled]:hover, .google[disabled].module--placeholder_button:hover, .google[disabled].area-picker-button:hover, .google[disabled].price-range-drop-down-arrow:hover, .button.google[disabled]:active, .google[disabled].module--placeholder_button:active, .google[disabled].area-picker-button:active, .google[disabled].price-range-drop-down-arrow:active, .standard-button.google[disabled]:hover, .standard-button.google[disabled]:active { background: #577df3; } .button.google:visited, .google.module--placeholder_button:visited, .google.area-picker-button:visited, .google.price-range-drop-down-arrow:visited, .button.google:hover, .google.module--placeholder_button:hover, .google.area-picker-button:hover, .google.price-range-drop-down-arrow:hover, .standard-button.google:visited, .standard-button.google:hover { color: white; } .button.float-right, .float-right.module--placeholder_button, .float-right.area-picker-button, .float-right.price-range-drop-down-arrow, .standard-button.float-right { float: right; } .button .ss-icon, .module--placeholder_button .ss-icon, .area-picker-button .ss-icon, .price-range-drop-down-arrow .ss-icon, .button .ui-dialog-titlebar-close, .module--placeholder_button .ui-dialog-titlebar-close, .area-picker-button .ui-dialog-titlebar-close, .price-range-drop-down-arrow .ui-dialog-titlebar-close, .button .close-icon, .module--placeholder_button .close-icon, .area-picker-button .close-icon, .price-range-drop-down-arrow .close-icon, .button .module__close, .module--placeholder_button .module__close, .area-picker-button .module__close, .price-range-drop-down-arrow .module__close, .button .area-picker li:after, .area-picker .button li:after, .module--placeholder_button .area-picker li:after, .area-picker .module--placeholder_button li:after, .area-picker-button .area-picker li:after, .area-picker .area-picker-button li:after, .price-range-drop-down-arrow .area-picker li:after, .area-picker .price-range-drop-down-arrow li:after, .button .recent-searches li:after, .recent-searches .button li:after, .module--placeholder_button .recent-searches li:after, .recent-searches .module--placeholder_button li:after, .area-picker-button .recent-searches li:after, .recent-searches .area-picker-button li:after, .price-range-drop-down-arrow .recent-searches li:after, .recent-searches .price-range-drop-down-arrow li:after, .button .recent-searches li:before, .recent-searches .button li:before, .module--placeholder_button .recent-searches li:before, .recent-searches .module--placeholder_button li:before, .area-picker-button .recent-searches li:before, .recent-searches .area-picker-button li:before, .price-range-drop-down-arrow .recent-searches li:before, .recent-searches .price-range-drop-down-arrow li:before, .standard-button .ss-icon, .standard-button .ui-dialog-titlebar-close, .standard-button .close-icon, .standard-button .module__close, .standard-button .area-picker li:after, .area-picker .standard-button li:after, .standard-button .recent-searches li:after, .recent-searches .standard-button li:after, .standard-button .recent-searches li:before, .recent-searches .standard-button li:before { margin-right: 7.5px; } .button--fixed { position: fixed; right: 15px; bottom: 15px; z-index: 8000; } .buttons { text-align: center; } .FavouriteItemAjax > div, .RemovedPropertyAjaxToggle > div > a, .refine-section .RemovedPropertyAjaxToggle > div > label { background: #ccc; border-color: #ccc; color: #4d4c4c; font-weight: bold; text-decoration: none; color: inherit; } .FavouriteItemAjax > div:visited, .RemovedPropertyAjaxToggle > div > a:visited, .refine-section .RemovedPropertyAjaxToggle > div > label:visited { color: #4d4c4c; } .FavouriteItemAjax > div:hover, .RemovedPropertyAjaxToggle > div > a:hover, .refine-section .RemovedPropertyAjaxToggle > div > label:hover { background: #bfbfbf; color: #333333; } .FavouriteItemAjax > div:active, .RemovedPropertyAjaxToggle > div > a:active, .refine-section .RemovedPropertyAjaxToggle > div > label:active { background: #b3b2b2; color: #1a1919; } .FavouriteItemAjax > div[disabled], .RemovedPropertyAjaxToggle > div > a[disabled], .refine-section .RemovedPropertyAjaxToggle > div > label[disabled] { background: #ccc; } .FavouriteItemAjax > div[disabled]:hover, .RemovedPropertyAjaxToggle > div > a[disabled]:hover, .refine-section .RemovedPropertyAjaxToggle > div > label[disabled]:hover, .FavouriteItemAjax > div[disabled]:active, .RemovedPropertyAjaxToggle > div > a[disabled]:active, .refine-section .RemovedPropertyAjaxToggle > div > label[disabled]:active { background: #ccc; } .FavouriteItemAjax > div a, .RemovedPropertyAjaxToggle > div > a a, .refine-section .RemovedPropertyAjaxToggle > div > label a, .FavouriteItemAjax > div .refine-section label, .refine-section .FavouriteItemAjax > div label, .RemovedPropertyAjaxToggle > div > a .refine-section label, .refine-section .RemovedPropertyAjaxToggle > div > a label, .refine-section .RemovedPropertyAjaxToggle > div > label label { text-decoration: none; color: inherit; } .FavouriteItemAjax > div .ss-icon, .FavouriteItemAjax > div .ui-dialog-titlebar-close, .FavouriteItemAjax > div .close-icon, .FavouriteItemAjax > div .module__close, .FavouriteItemAjax > div .area-picker li:after, .area-picker .FavouriteItemAjax > div li:after, .FavouriteItemAjax > div .recent-searches li:after, .recent-searches .FavouriteItemAjax > div li:after, .FavouriteItemAjax > div .recent-searches li:before, .recent-searches .FavouriteItemAjax > div li:before { margin-right: 7.5px; } .FavouriteItemAjax > div.saved { background: #edca07; border-color: #edca07; color: white; } .FavouriteItemAjax > div.saved:visited { color: white; } .FavouriteItemAjax > div.saved:hover { background: #d4b506; color: white; } .FavouriteItemAjax > div.saved:active { background: #bba006; color: white; } .FavouriteItemAjax > div.saved[disabled] { background: #edca07; } .FavouriteItemAjax > div.saved[disabled]:hover, .FavouriteItemAjax > div.saved[disabled]:active { background: #edca07; } .FavouriteItemAjax > div.saved .ss-icon, .FavouriteItemAjax > div.saved .ui-dialog-titlebar-close, .FavouriteItemAjax > div.saved .close-icon, .FavouriteItemAjax > div.saved .module__close, .FavouriteItemAjax > div.saved .area-picker li:after, .area-picker .FavouriteItemAjax > div.saved li:after, .FavouriteItemAjax > div.saved .recent-searches li:after, .recent-searches .FavouriteItemAjax > div.saved li:after, .FavouriteItemAjax > div.saved .recent-searches li:before, .recent-searches .FavouriteItemAjax > div.saved li:before { color: white; } .RemovedPropertyAjaxToggle > div > a .ss-icon, .refine-section .RemovedPropertyAjaxToggle > div > label .ss-icon, .RemovedPropertyAjaxToggle > div > a .ui-dialog-titlebar-close, .refine-section .RemovedPropertyAjaxToggle > div > label .ui-dialog-titlebar-close, .RemovedPropertyAjaxToggle > div > a .close-icon, .refine-section .RemovedPropertyAjaxToggle > div > label .close-icon, .RemovedPropertyAjaxToggle > div > a .module__close, .refine-section .RemovedPropertyAjaxToggle > div > label .module__close, .RemovedPropertyAjaxToggle > div > a .area-picker li:after, .area-picker .RemovedPropertyAjaxToggle > div > a li:after, .refine-section .RemovedPropertyAjaxToggle > div > label .area-picker li:after, .area-picker .refine-section .RemovedPropertyAjaxToggle > div > label li:after, .RemovedPropertyAjaxToggle > div > a .recent-searches li:after, .recent-searches .RemovedPropertyAjaxToggle > div > a li:after, .refine-section .RemovedPropertyAjaxToggle > div > label .recent-searches li:after, .recent-searches .refine-section .RemovedPropertyAjaxToggle > div > label li:after, .RemovedPropertyAjaxToggle > div > a .recent-searches li:before, .recent-searches .RemovedPropertyAjaxToggle > div > a li:before, .refine-section .RemovedPropertyAjaxToggle > div > label .recent-searches li:before, .recent-searches .refine-section .RemovedPropertyAjaxToggle > div > label li:before { margin-right: 7.5px; } .circle, .circle--img { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ background: white; border: 4px double #075ca7; border-radius: 100%; text-align: center; padding: 15px; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; } .circle .ss-icon.large, .circle--img .ss-icon.large, .circle .large.ui-dialog-titlebar-close, .circle--img .large.ui-dialog-titlebar-close, .circle .large.close-icon, .circle--img .large.close-icon, .circle .large.module__close, .circle--img .large.module__close, .circle .area-picker li.large:after, .area-picker .circle li.large:after, .circle--img .area-picker li.large:after, .area-picker .circle--img li.large:after, .circle .recent-searches li.large:after, .recent-searches .circle li.large:after, .circle--img .recent-searches li.large:after, .recent-searches .circle--img li.large:after, .circle .recent-searches li.large:before, .recent-searches .circle li.large:before, .circle--img .recent-searches li.large:before, .recent-searches .circle--img li.large:before { font-size: 26px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .circle, .circle--img { padding: 14%; } .circle p, .circle--img p { font-size: 12px; } .circle .ss-icon.large, .circle--img .ss-icon.large, .circle .large.ui-dialog-titlebar-close, .circle--img .large.ui-dialog-titlebar-close, .circle .large.close-icon, .circle--img .large.close-icon, .circle .large.module__close, .circle--img .large.module__close, .circle .area-picker li.large:after, .area-picker .circle li.large:after, .circle--img .area-picker li.large:after, .area-picker .circle--img li.large:after, .circle .recent-searches li.large:after, .recent-searches .circle li.large:after, .circle--img .recent-searches li.large:after, .recent-searches .circle--img li.large:after, .circle .recent-searches li.large:before, .recent-searches .circle li.large:before, .circle--img .recent-searches li.large:before, .recent-searches .circle--img li.large:before { font-size: 50px; } } @media only screen and (min-width: 43em) and (max-width: 54em) { .circle .ss-icon.large, .circle--img .ss-icon.large, .circle .large.ui-dialog-titlebar-close, .circle--img .large.ui-dialog-titlebar-close, .circle .large.close-icon, .circle--img .large.close-icon, .circle .large.module__close, .circle--img .large.module__close, .circle .area-picker li.large:after, .area-picker .circle li.large:after, .circle--img .area-picker li.large:after, .area-picker .circle--img li.large:after, .circle .recent-searches li.large:after, .recent-searches .circle li.large:after, .circle--img .recent-searches li.large:after, .recent-searches .circle--img li.large:after, .circle .recent-searches li.large:before, .recent-searches .circle li.large:before, .circle--img .recent-searches li.large:before, .recent-searches .circle--img li.large:before { font-size: 40px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .circle .ss-icon.large, .circle--img .ss-icon.large, .circle .large.ui-dialog-titlebar-close, .circle--img .large.ui-dialog-titlebar-close, .circle .large.close-icon, .circle--img .large.close-icon, .circle .large.module__close, .circle--img .large.module__close, .circle .area-picker li.large:after, .area-picker .circle li.large:after, .circle--img .area-picker li.large:after, .area-picker .circle--img li.large:after, .circle .recent-searches li.large:after, .recent-searches .circle li.large:after, .circle--img .recent-searches li.large:after, .recent-searches .circle--img li.large:after, .circle .recent-searches li.large:before, .recent-searches .circle li.large:before, .circle--img .recent-searches li.large:before, .recent-searches .circle--img li.large:before { font-size: 20px; } } @media only screen and (max-width: 480px) { .circle .ss-icon.large, .circle--img .ss-icon.large, .circle .large.ui-dialog-titlebar-close, .circle--img .large.ui-dialog-titlebar-close, .circle .large.close-icon, .circle--img .large.close-icon, .circle .large.module__close, .circle--img .large.module__close, .circle .area-picker li.large:after, .area-picker .circle li.large:after, .circle--img .area-picker li.large:after, .area-picker .circle--img li.large:after, .circle .recent-searches li.large:after, .recent-searches .circle li.large:after, .circle--img .recent-searches li.large:after, .recent-searches .circle--img li.large:after, .circle .recent-searches li.large:before, .recent-searches .circle li.large:before, .circle--img .recent-searches li.large:before, .recent-searches .circle--img li.large:before { font-size: 30px; } .circle p, .circle--img p { font-size: 11px; } } .context-info { padding: 15px 0; border-bottom: 1px dotted #d6d6d6; } .context-info:last-child { border-bottom: none; } .context-info__image { margin-right: 30px; margin-right: 30px; width: 100px; } .context-info__body { color: #a3a3a3; } .context-info__body-text { font-size: 14px; } .context-info__member { font-size: 14px; font-size: 14px; color: #3AC337; font-weight: bold; } @media only screen and (max-width: 48em) { .context-info__member { font-size: 13.3px; font-size: 13.3px; } } @media only screen and (max-width: 30em) { .context-info__member { font-size: 12.6px; font-size: 12.6px; } } .context-info--b .context-info__image { margin-left: 30px; margin-left: 30px; float: right; margin-right: 0 !important; } .context-info--stacked { padding: 7.5px; text-align: center; } .context-info--stacked .context-info__image { width: 41.6666666667%; float: none; margin: 0 auto; margin-bottom: 15px; } /*------------------------------------* DIALOGS /*------------------------------------*/ .dialog, .dialog--large { background: white; border-radius: 5px 5px 5px 5px; padding: 15px; margin-bottom: 15px; padding: 30px; width: 400px; z-index: 8001; margin-left: -200px; position: absolute; top: 15%; left: 50%; -webkit-box-sizing: border-box; box-sizing: border-box; min-height: 200px; } .dialog--large { width: 760px; margin-left: -380px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .dialog--large { width: 400px; margin-left: -200px; } .dialog--large .dialog__main { padding: 0; width: 100%; border: 0; } .dialog--large .dialog__context { display: none; } } .dialog__main { width: 50%; float: left; box-sizing: border-box; -webkit-box-sizing: border-box; padding-right: 30px; border-right: 1px dotted #d6d6d6; } .dialog__context { width: 50%; float: right; box-sizing: border-box; -webkit-box-sizing: border-box; padding-left: 30px; } .modal:before { content: ''; display: block; position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; background: rgba(0, 0, 0, 0.6); z-index: 8000; } .dialog__close { text-decoration: none; color: #333333; opacity: 0.5; position: absolute; top: 15px; right: 15px; } .dialog__close:hover { opacity: 1; } .dialog__or { border-top: 1px solid #d6d6d6; margin-right: -30px; margin-left: -30px; margin-top: 15px; text-align: center; padding: 30px 0 0 0; position: relative; } .dialog__or > * { margin: 0 5px; } .dialog__or:before { content: 'or'; padding: 7.5px; position: absolute; background: white; top: -15px; z-index: 1; left: 50%; margin-left: -15px; color: #a3a3a3; font-weight: bold; text-transform: uppercase; } .dialog__title { font-size: 26px; font-weight: normal; text-align: center; } .ui-dialog[style] { height: auto !important; } .ui-dialog-title { font-size: 1.8em; } .ui-dialog-titlebar { margin-bottom: 15px; } .ui-dialog { position: fixed !important; top: 10% !important; -webkit-box-shadow: 1px 1px 10px #666; box-shadow: 1px 1px 10px #666; } .ui-dialog .module, .ui-dialog .member--count { padding: 0; margin: 0; } .ui-dialog .standard-form { margin-bottom: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .ui-dialog fieldset { min-width: 384px; padding: 15px 0; } .ui-dialog .input-group { max-width: 398px; } } .ui-dialog-titlebar-close, .close-icon, .module__close { z-index: 8000; text-decoration: none; position: absolute; color: #333; right: 22.5px; top: 22.5px; opacity: 0.5; padding: 3.75px; } .ui-dialog-titlebar-close:before, .close-icon:before, .module__close:before { content: '\2421'; } .ui-dialog-titlebar-close:hover, .close-icon:hover, .module__close:hover { opacity: 1; cursor: pointer; } .ui-dialog-titlebar-close .ui-icon-closethick, .close-icon .ui-icon-closethick, .module__close .ui-icon-closethick { display: none; } #ui-dialog-title-PgJqueryDialog-Login-Register { display: none; } #PgJqueryDialog-Login-Register h2 { display: none; } #PgJqueryDialog-Login-Register .input { padding-left: 0; } .ui-dialog-content #contact-agent-form .buttons { text-align: center; } .ui-dialog-content #contact-agent-form .remember { float: none; } .ui-dialog-content #contact-agent-form .remember label { margin-top: -5px; } /*------------------------------------* DOT INDICATORS Dot indicators are used in slideshows as a way of showing which slide the user is currently on and the number of slides The HTML should be as follows
/*------------------------------------*/ .dot-indicators--small, .dot-indicators, .slide-show-nav, #featured-nav, #new-dev-featured-nav { text-align: center; } .dot-indicators--small > ul, .dot-indicators > ul, .slide-show-nav > ul, #featured-nav > ul, #new-dev-featured-nav > ul { text-align: center; margin-bottom: 0; } .dot-indicators--small li, .dot-indicators li, .slide-show-nav li, #featured-nav li, #new-dev-featured-nav li { margin: 0 9px; display: inline-block; } .dot-indicators--small a, .dot-indicators a, .slide-show-nav a, #featured-nav a, #new-dev-featured-nav a, .dot-indicators--small .refine-section label, .refine-section .dot-indicators--small label, .dot-indicators .refine-section label, .refine-section .dot-indicators label, .slide-show-nav .refine-section label, .refine-section .slide-show-nav label, #featured-nav .refine-section label, .refine-section #featured-nav label, #new-dev-featured-nav .refine-section label, .refine-section #new-dev-featured-nav label { background: white; display: block; width: 18px; height: 18px; border-radius: 100% 100% 100% 100%; } .dot-indicators--small .current a, .dot-indicators .current a, .slide-show-nav .current a, #featured-nav .current a, #new-dev-featured-nav .current a, .dot-indicators--small .current .refine-section label, .refine-section .dot-indicators--small .current label, .dot-indicators .current .refine-section label, .refine-section .dot-indicators .current label, .slide-show-nav .current .refine-section label, .refine-section .slide-show-nav .current label, #featured-nav .current .refine-section label, .refine-section #featured-nav .current label, #new-dev-featured-nav .current .refine-section label, .refine-section #new-dev-featured-nav .current label { background: #D23722; } .module .dot-indicators--small a, .member--count .dot-indicators--small a, .module .dot-indicators a, .member--count .dot-indicators a, .module .slide-show-nav a, .member--count .slide-show-nav a, .module #featured-nav a, .member--count #featured-nav a, .module #new-dev-featured-nav a, .member--count #new-dev-featured-nav a, .module .dot-indicators--small .refine-section label, .refine-section .module .dot-indicators--small label, .member--count .dot-indicators--small .refine-section label, .refine-section .member--count .dot-indicators--small label, .module .dot-indicators .refine-section label, .refine-section .module .dot-indicators label, .member--count .dot-indicators .refine-section label, .refine-section .member--count .dot-indicators label, .module .slide-show-nav .refine-section label, .refine-section .module .slide-show-nav label, .member--count .slide-show-nav .refine-section label, .refine-section .member--count .slide-show-nav label, .module #featured-nav .refine-section label, .refine-section .module #featured-nav label, .member--count #featured-nav .refine-section label, .refine-section .member--count #featured-nav label, .module #new-dev-featured-nav .refine-section label, .refine-section .module #new-dev-featured-nav label, .member--count #new-dev-featured-nav .refine-section label, .refine-section .member--count #new-dev-featured-nav label, .module--modal .dot-indicators--small a, .module--modal .dot-indicators a, .module--modal .slide-show-nav a, .module--modal #featured-nav a, .module--modal #new-dev-featured-nav a, .module--modal .dot-indicators--small .refine-section label, .refine-section .module--modal .dot-indicators--small label, .module--modal .dot-indicators .refine-section label, .refine-section .module--modal .dot-indicators label, .module--modal .slide-show-nav .refine-section label, .refine-section .module--modal .slide-show-nav label, .module--modal #featured-nav .refine-section label, .refine-section .module--modal #featured-nav label, .module--modal #new-dev-featured-nav .refine-section label, .refine-section .module--modal #new-dev-featured-nav label { background: #e5edf3; } .module .dot-indicators--small .current a, .member--count .dot-indicators--small .current a, .module .dot-indicators .current a, .member--count .dot-indicators .current a, .module .slide-show-nav .current a, .member--count .slide-show-nav .current a, .module #featured-nav .current a, .member--count #featured-nav .current a, .module #new-dev-featured-nav .current a, .member--count #new-dev-featured-nav .current a, .module .dot-indicators--small .current .refine-section label, .refine-section .module .dot-indicators--small .current label, .member--count .dot-indicators--small .current .refine-section label, .refine-section .member--count .dot-indicators--small .current label, .module .dot-indicators .current .refine-section label, .refine-section .module .dot-indicators .current label, .member--count .dot-indicators .current .refine-section label, .refine-section .member--count .dot-indicators .current label, .module .slide-show-nav .current .refine-section label, .refine-section .module .slide-show-nav .current label, .member--count .slide-show-nav .current .refine-section label, .refine-section .member--count .slide-show-nav .current label, .module #featured-nav .current .refine-section label, .refine-section .module #featured-nav .current label, .member--count #featured-nav .current .refine-section label, .refine-section .member--count #featured-nav .current label, .module #new-dev-featured-nav .current .refine-section label, .refine-section .module #new-dev-featured-nav .current label, .member--count #new-dev-featured-nav .current .refine-section label, .refine-section .member--count #new-dev-featured-nav .current label, .module--modal .dot-indicators--small .current a, .module--modal .dot-indicators .current a, .module--modal .slide-show-nav .current a, .module--modal #featured-nav .current a, .module--modal #new-dev-featured-nav .current a, .module--modal .dot-indicators--small .current .refine-section label, .refine-section .module--modal .dot-indicators--small .current label, .module--modal .dot-indicators .current .refine-section label, .refine-section .module--modal .dot-indicators .current label, .module--modal .slide-show-nav .current .refine-section label, .refine-section .module--modal .slide-show-nav .current label, .module--modal #featured-nav .current .refine-section label, .refine-section .module--modal #featured-nav .current label, .module--modal #new-dev-featured-nav .current .refine-section label, .refine-section .module--modal #new-dev-featured-nav .current label { background: #a3a3a3; } .dot-indicators--small li { margin: 0 0.8%; } .dot-indicators--small a, .dot-indicators--small .refine-section label, .refine-section .dot-indicators--small label { width: 9px; height: 9px; } .dot-indicators, .slide-show-nav, #featured-nav, #new-dev-featured-nav { margin-bottom: 15px; } /* +Enhance your property ------------------------------------------------------------------------ */ #enhance-property-form { background: url(/images/sitefiles/enhanced/background.png) no-repeat top center transparent; padding: 15px 70px; margin-top: 15px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #enhance-property-form { padding: 15px 20px; } } #enhance-property-form #recent-searches-link { display: none; } .enhance-title { padding: 70px 0; } .enhance-title .module-title { background: none; padding: 0; margin-bottom: 0; } .enhance-title h2 { -webkit-text-shadow: 0px 2px 2px #333333; -moz-text-shadow: 0px 2px 2px #333333; text-shadow: 0px 2px 2px #333333; font-size: 47.4px; text-transform: uppercase; margin-bottom: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .enhance-title h2 { margin: 15px 10% 15px 10%; font-size: 44px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .enhance-title h2 { margin: 15px 10% 15px 10%; font-size: 38px; } } .enhance-title h3 { font-size: 19px; -webkit-text-shadow: 0px 2px 2px #333333; -moz-text-shadow: 0px 2px 2px #333333; text-shadow: 0px 2px 2px #333333; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .enhance-title h3 { font-size: 16px; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .enhance-title { padding: 40px 0; } } @media only screen and (max-width: 48em) { .enhance-title { padding: 30px 0; } } .enhance-inner { background: white; border-radius: 5px; } .enhance-inner .standard-form { border: none; background: none; } .enhance-inner .standard-form .error-placeholder.untested { font-size: 18px; } .enhance-inner .standard-form .error-placeholder.failed { display: inline; margin-left: 8px; font-size: 12px; top: -2px; position: relative; font-weight: normal; white-space: nowrap; } .enhance-inner .standard-form fieldset { padding: 60px; } .enhance-inner .standard-form fieldset.property-select, .enhance-inner .standard-form fieldset.package-select, .enhance-inner .standard-form fieldset.date-select { border-bottom: 1px solid #d6d6d6; } .enhance-inner .standard-form fieldset.date-select span.input { font-size: 12px; } .enhance-inner .standard-form .input-group.terms-and-conditions { margin-bottom: 15px; } .enhance-inner .standard-form .input-group.terms-and-conditions input { margin-bottom: 15px; } .section-title { margin-bottom: 22.5px; } .section-title h3 { margin-bottom: 0; } .section-title .step-num { border-radius: 0 25px 25px 0; background: #D23722; display: inline-block; padding: 6px 16px; float: left; margin-left: -60px; position: relative; top: -2px; } .section-title .step-num span { color: white; font-weight: bold; font-size: 24px; position: relative; left: -2px; } .property-selector-container { position: relative; } .property-selector-container h3 { position: relative; top: 6px; } #property-search-autocomplete .search-button { display: none; } #property-search-autocomplete .search-text-box-outer-inner { position: relative; } #property-search-autocomplete img.loading-spinner { position: absolute; right: 14px; top: 14px; } #property-search-autocomplete input.search-box-text { max-width: 98%; height: 30px; font-size: 22px; color: #888888; } #property-search-autocomplete input.search-box-text[style] { width: 100% !important; } #property-search-autocomplete ul.search-list { width: 99.5%; font-size: 16px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #property-search-autocomplete ul.search-list { width: 99.8%; font-size: 14px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #property-search-autocomplete ul.search-list { width: 101%; font-size: 12px; } } #property-search-autocomplete ul.search-list li { padding: 8px; } #property-search-autocomplete ul.search-list li span.price { font-weight: bold; } #property-search-autocomplete ul.search-list li span.agent-logos img { width: 22%; max-width: 60px; float: right; position: relative; } #property-search-autocomplete ul.search-list .property-item .img { width: 90px; height: 60px; } #property-search-autocomplete ul.search-list .property-item .img img { width: 90px; } #property-search-autocomplete .selected-item { float: none; background: white; border: 1px solid #e3e3e3; border-radius: 0; margin: 0 auto; overflow: visible; } #property-search-autocomplete .selected-item:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } #property-search-autocomplete .selected-item .image-wrapper, #property-search-autocomplete .selected-item #services .blog-entry img, #services .blog-entry #property-search-autocomplete .selected-item img { display: block; margin-bottom: 4px; } #property-search-autocomplete .selected-item .image-wrapper img, #property-search-autocomplete .selected-item #services .blog-entry img img, #services .blog-entry #property-search-autocomplete .selected-item img img { max-height: 100%; max-width: 100%; vertical-align: middle; } #property-search-autocomplete .selected-item .details span.agent-logos img { width: 21%; max-width: 60px; float: right; margin: 0 0 0 8px; } #property-search-autocomplete .selected-item h2.address { color: #2771c4; font-weight: bold; margin-bottom: 14px; } #property-search-autocomplete .selected-item h3.price { font-weight: bold; font-size: 1.8em; } #property-search-autocomplete .selected-item .summary span { border-left: 1px solid #DDDDDD; font-weight: normal; } #property-search-autocomplete .selected-item .summary span:first-child { border-left: none; } #property-search-autocomplete .selected-item .summary span.status { font-weight: bold; } #property-search-autocomplete .selected-item .close { border: none; width: auto; text-decoration: underline; font-weight: normal; top: inherit; left: 0px; bottom: -35px; } #property-search-autocomplete .selected-item .close:hover { background: transparent; text-decoration: none; color: #2771c4; } #property-search-autocomplete .search-text-box-outer-inner[style] { margin-left: 0 !important; } .packages { margin-bottom: 22px; } .packages:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .packages .package { width: 31%; float: left; margin-right: 0.6%; position: relative; top: 30px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .packages .package { margin-bottom: 15px; top: 25px; } } .packages .package .best-tag { border-radius: 2.5px; background: #D23722; border: 1px solid #a62c1b; width: 70%; padding: 4px 7.5px; margin: 0 auto; margin-bottom: 15px; margin-top: -25px; } .packages .package .best-tag span { text-transform: uppercase; font-weight: bold; font-size: 11px; color: white; } .packages .package.premium { width: 36%; top: 8px; } .packages .package.promo .inner { border-radius: 5px 0 0 5px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .packages .package.promo .inner { border-radius: 5px; } } .packages .package.featured .inner { border-radius: 0 5px 5px 0; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .packages .package.featured .inner { border-radius: 5px; } } .packages .package .inner { padding: 15px 10px; border: 1px solid #d7d7d7; background: #EBEBEB; border-radius: 5px; text-align: center; min-height: 200px; } .packages .package .inner .package-image { margin: 0px -10px 15px -10px; border-top: 1px solid #cecece; border-bottom: 1px solid #cecece; } .packages .package .inner .package-image img { width: 100%; } .packages .package .inner p.package-info { margin-bottom: 15px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .packages .package .inner p.package-info { height: 50px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .packages .package .inner p.package-info { height: auto; font-size: 12px; height: 58px; } } .packages .package .inner .price { margin-bottom: 7.5px; } .packages .package .inner .price p { font-weight: bold; font-size: 32px; } .packages .package .inner .price p span { font-size: 14px; font-weight: normal; } .packages .package .inner .selected { display: none; } .packages .package.selected .inner { background: #F8BB4E; border: 1px solid #F8BB4E; color: white; } .packages .package.selected .inner .package-image { border-top: 1px solid #F8BB4E; border-bottom: 1px solid #F8BB4E; } .packages .package.selected .button.select-this, .packages .package.selected .select-this.module--placeholder_button, .packages .package.selected .select-this.area-picker-button, .packages .package.selected .select-this.price-range-drop-down-arrow { display: none; } .packages .package.selected .button.selected, .packages .package.selected .selected.module--placeholder_button, .packages .package.selected .selected.area-picker-button, .packages .package.selected .selected.price-range-drop-down-arrow { display: block; background: none; color: #a66d07; border: 1px dotted #a66d07; cursor: default; padding: 6px 0; } .start-date label span { font-weight: normal; font-size: 11px; } .overview { background: #EBEBEB; padding: 20px 40px; border: 1px solid #E2DED4; border-top: none; } .overview:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .overview.thanks { margin-bottom: 15px; } .overview h3 { font-size: 1.8em; } .overview p { font-size: 1em; } .overview .span-4, .overview .grid .result, .grid .overview .result { text-align: right; } .overview .total-price { font-weight: bold; font-size: 24px; float: right; line-height: 40px; margin-left: 8%; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .overview .span-8, .overview .span-4, .overview .grid .result, .grid .overview .result { float: none; width: auto; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .overview .span-8, .overview .span-4, .overview .grid .result, .grid .overview .result { float: none; width: auto; } } .order-overview .enhance-inner { padding: 60px; } .order-overview .enhance-inner .overview { border: 1px solid #E2DED4; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .order-overview .enhance-inner { padding: 30px; } .order-overview .enhance-inner .step-num { margin-left: -30px; margin-right: 15px; } .order-overview .enhance-inner h2.address, .order-overview .enhance-inner h3.price { font-size: 1.2em; } .order-overview .enhance-inner p.summary, .order-overview .enhance-inner p.description { font-size: 11px; } } .order-overview .featured-property-preview { margin-bottom: 45px; } .order-overview .featured-property-preview:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .order-overview .featured-property-preview .featured-property-wrapper { margin-bottom: 0; } .order-overview .result { border: 1px solid #d6d6d6; margin-bottom: 45px; } .order-overview .result.promo { border: 2px solid #F8BB4E; padding-bottom: 45px; } .order-overview .result.promo .promo-tag { margin-left: -4px; } .order-overview .result h2.grid-address, .order-overview .result ul.actions, .order-overview .result .remove-icon { display: none; } .order-overview .result .address { margin-right: 60px; } .order-overview .result .image-wrapper, .order-overview .result #services .blog-entry img, #services .blog-entry .order-overview .result img { display: block; } .order-overview .result .image-wrapper img, .order-overview .result #services .blog-entry img img, #services .blog-entry .order-overview .result img img { max-height: 100%; max-width: 100%; } .order-overview .result .agent-logo { width: auto; } .order-overview .confirm { clear: both; } .order-overview .featured-property-wrapper { margin-bottom: 45px; border: 1px solid #e3e3e3; } .order-overview .featured-property-wrapper .featured-property .info-container .text { width: 75%; } .order-overview .featured-property-wrapper .featured-property .info-container .text p { line-height: 15px; } .order-overview .featured-property-wrapper .featured-property .info-container .text p.time-ago { font-size: 11px; } .order-overview button.stripe-button-el span { background: #075ca7; border-color: #075ca7; color: white; text-shadow: none; -webkit-box-shadow: none; box-shadow: none; padding: 4px 15px; margin: 0 auto; line-height: 2em; } .order-overview button.stripe-button-el span:visited { color: white; } .order-overview button.stripe-button-el span:hover { background: #064f8f; color: white; } .order-overview button.stripe-button-el span:active { background: #054176; color: white; } .order-overview button.stripe-button-el span[disabled] { background: #075ca7; } .order-overview button.stripe-button-el span[disabled]:hover, .order-overview button.stripe-button-el span[disabled]:active { background: #075ca7; } .order-overview .confirm-enhanced-property a, .order-overview .confirm-enhanced-property .refine-section label, .refine-section .order-overview .confirm-enhanced-property label { display: block; text-align: right; margin: 8px 8px 0 0; } .order-overview .confirm-enhanced-property form { padding: 30px 0; } .order-overview .thanks-title, .order-overview .sorry-title { font-size: 2em; margin-bottom: 15px; } #enhance-property-promo { background: url(/images/sitefiles/enhanced/brochure-spot-bg.png) no-repeat top center #DCD8D0; text-align: center; } #enhance-property-promo h2 { -webkit-text-shadow: 0px 2px 2px #333333; -moz-text-shadow: 0px 2px 2px #333333; text-shadow: 0px 2px 2px #333333; color: white; font-size: 42px; line-height: 38px; } #enhance-property-promo p { -webkit-text-shadow: 0px 2px 2px #333333; -moz-text-shadow: 0px 2px 2px #333333; text-shadow: 0px 2px 2px #333333; font-weight: bold; color: white; font-size: 17px; line-height: 24px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #enhance-property-promo h2 { font-size: 38px; } #enhance-property-promo p { font-size: 16px; line-height: 20px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #enhance-property-promo { padding: 30px; text-align: center; } } .results-listings #enhance-property-promo h2 { font-size: 25px; line-height: 32px; } .results-listings #enhance-property-promo p { font-size: 16px; line-height: 22px; } /*------------------------------------* FORMS /*------------------------------------*/ input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], .input { font-size: 14px; font-family: sans-serif; line-height: 1em; padding: 5px; margin: 0; } /* Placeholders */ .field-group { margin-bottom: 7.5px; } .field-group__label { display: block; margin-right: 0; font-size: 14px; font-weight: bold; line-height: 30px; color: #a3a3a3; } .field-group__input { margin-right: 0; line-height: 28px; } .field-group__input input[type="email"], .field-group__input input[type="number"], .field-group__input input[type="password"], .field-group__input input[type="search"], .field-group__input input[type="tel"], .field-group__input input[type="text"], .field-group__input input[type="url"], .field-group__input input[type="color"], .field-group__input input[type="date"], .field-group__input input[type="datetime"], .field-group__input input[type="datetime-local"], .field-group__input input[type="month"], .field-group__input input[type="time"], .field-group__input input[type="week"] { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ display: inline-block; vertical-align: baseline; padding-top: 0; padding-top: 0; padding-bottom: 0; padding-bottom: 0; padding-left: 7.5px; padding-left: 7.5px; padding-right: 7.5px; padding-right: 7.5px; color: #333; background: white; line-height: 15px; max-width: 100%; min-height: 33px; width: auto; font-family: sans-serif; border: 1px solid 1px solid grey; } .field-group__link { line-height: 30px; } .form__actions { line-height: 30px; } .form__actions > :last-child:after { content: '▻'; font-family: "SSStandard-web"; font-size: 10px; margin-left: 7.5px; } fieldset.form { line-height: 1.6em; } fieldset.form input, fieldset.form textarea, fieldset.form .select-box { margin-bottom: 15px; margin-bottom: 15px; } @media only screen and (max-width: 48em) { fieldset.form input, fieldset.form textarea, fieldset.form .select-box { margin-bottom: 14.25px; margin-bottom: 14.25px; } } @media only screen and (max-width: 30em) { fieldset.form input, fieldset.form textarea, fieldset.form .select-box { margin-bottom: 13.5px; margin-bottom: 13.5px; } } fieldset.form input:last-child, fieldset.form textarea:last-child, fieldset.form .select-box:last-child { margin-bottom: 0; } /* Field Group */ .input--full-width { width: 100% !important; } .input--small-width { width: 35% !important; } .input--medium-width { width: 62% !important; } /* Standard Form */ .standard-form { background: #f9f7f5; padding: 15px; border: 1px solid #e5e0d6; margin: 0 0 15px 0; padding: 0; } .standard-form p, .standard-form ul { margin: 0; } .standard-form .info { border-bottom: 1px solid #e5e0d6; margin: 0; padding: 7.5px 15px; } .standard-form fieldset { padding: 15px; max-width: 100%; } .standard-form input { max-width: 89%; } .standard-form textarea { max-width: 90%; margin-right: 2px; } .standard-form select { max-width: 100%; } .standard-form .input-group { clear: both; margin: 0; max-width: 100%; padding: 5px 0; position: relative; } .standard-form label { font-weight: bold; position: relative; } .standard-form .remember-label { font-size: 0.9em; } .standard-form p.error { color: #D23722; padding: 15px; } /* error placeholder */ .error-placeholder, #CaptchaValidation { display: inline; font-size: 14px; color: #D23722; font-style: normal; } .error-placeholder.failed, #CaptchaValidation.failed { padding-top: 7.5px; font-size: 10px; font-weight: bold; background: #D23722; padding: 3.75px 7.5px; color: white; border-radius: 2.5px; line-height: 1; position: absolute; left: 0; top: -6px; } .error-placeholder.success, #CaptchaValidation.success { background: transparent; padding: 0; border: none; } .ui-dialog .standard-form { margin-top: -15px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .standard-form .input-group input[type="search"], .standard-form .input-group input[type="number"], .standard-form .input-group input[type="email"], .standard-form .input-group input[type="url"], .standard-form .input-group input[type="tel"], .standard-form .input-group input[type="text"], .standard-form .input-group textarea, .standard-form .input-group input[type="password"] { font-size: 1.4em; border-radius: 0; border: 1px solid #d6d6d6; } } .success { background: #ddf2cf; border: 1px solid #c1e7a7; padding: 15px; } .success p { margin-bottom: 0; } .warning { background: #F5EDCA; border: 1px solid #edde9f; padding: 15px; } .warning p { margin-bottom: 0; } /* Labels floated to the left */ .floated label { float: left; width: 30%; text-align: right; margin-right: 2%; padding-top: 7.5px; } .floated .failed { margin-left: 32%; } .floated input, .floated textarea { max-width: 58%; } .floated .buttons input { max-width: 100%; } .floated .input-group.buttons { margin: 0 0 0 32%; text-align: left; } /* Custom inputs */ .custom-checkbox { /* checked mark aspect changes */ } .custom-checkbox [type="checkbox"]:not(:checked), .custom-checkbox [type="checkbox"]:checked { position: absolute; left: -9999px; } .custom-checkbox [type="checkbox"]:not(:checked) + label, .custom-checkbox [type="checkbox"]:checked + label { position: relative; padding-right: 37.5px; cursor: pointer; } .custom-checkbox [type="checkbox"]:not(:checked) + label:before, .custom-checkbox [type="checkbox"]:checked + label:before { content: ''; position: absolute; right: 0px; top: 0px; width: 28px; height: 28px; border: 1px solid #d6d6d6; background: white; border-radius: 5px; -webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.3); } .custom-checkbox [type="checkbox"]:not(:checked) + label.above:before, .custom-checkbox [type="checkbox"]:checked + label.above:before { right: 50%; margin-right: 0; top: 21.5px; } .custom-checkbox [type="checkbox"]:not(:checked) + label:after, .custom-checkbox [type="checkbox"]:checked + label:after { content: '✓'; position: absolute; font-family: SSStandard-web; top: 3px; right: 5px; font-size: 18px; color: #d23722; } .custom-checkbox [type="checkbox"]:not(:checked) + label.above:after, .custom-checkbox [type="checkbox"]:checked + label.above:after { right: 50%; margin-right: 4px; top: 26.5px; } .custom-checkbox [type="checkbox"]:not(:checked) + label:after { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } .custom-checkbox [type="checkbox"]:checked + label:after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .g-recaptcha { margin-top: 0.6%; } .input-failed { border: 1px solid #D23722 !important; } /*------------------------------------* GRID /*------------------------------------*/ .col, .grid .result { float: left; width: 100%; margin-right: 2.4%; } .span-1 { width: 6.1333333333%; } .span-2 { width: 14.6666666667%; } .span-3 { width: 23.2%; } .span-4, .grid .result { width: 31.7333333333%; } .span-5 { width: 40.2666666667%; } .span-6 { width: 48.8%; } .span-7 { width: 57.3333333333%; } .span-8 { width: 65.8666666667%; } .span-9 { width: 74.4%; } .span-10 { width: 82.9333333333%; } .span-11 { width: 91.4666666667%; } .span-12 { width: 100%; } .gutter-left-2 { margin-left: 17.0666666667%; } .gutter-right-2 { margin-right: 17.0666666667%; } .last { margin-right: 0; } .layout-grid { display: block; margin-left: -16px; margin-right: -16px; overflow: hidden; padding-left: 0; padding-right: 0; } .layout-grid:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .layout-grid > * { float: left; padding-left: 16px; padding-right: 16px; width: 25%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .layout-grid > *:nth-child(4n+1) { clear: both; } .layout-grid__item-inner { width: 100%; height: 0px; padding-bottom: 100%; position: relative; margin: 10px 0; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .layout-grid:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .layout-grid > * { float: left; padding-left: 16px; padding-right: 16px; width: 50%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .layout-grid > *:nth-child(2n+1) { clear: both; } .layout-grid .layout-grid__item { padding-left: 60px; padding-right: 60px; } } @media only screen and (min-width: 43em) and (max-width: 54em) { .layout-grid .layout-grid__item { padding-left: 45px; padding-right: 45px; } .layout-grid .layout-grid__item p { font-size: 11px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .layout-grid:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .layout-grid > * { float: left; padding-left: 16px; padding-right: 16px; width: 50%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .layout-grid > *:nth-child(2n+1) { clear: both; } .layout-grid p { font-size: 12px; } } @media only screen and (max-width: 480px) { .layout-grid:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .layout-grid > * { float: left; padding-left: 16px; padding-right: 16px; width: 100%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .layout-grid > *:nth-child(1n+1) { clear: both; } .layout-grid .layout-grid__item { padding-left: 15px; padding-right: 15px; } } .inner-container { width: 1000px; margin: 0 auto; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .inner-container { width: 98%; margin: 0 auto; } } .hide-me { display: none; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .editable-area .span-8:first-child, .editable-area .span-9:first-child { width: 100%; } .editable-area .span-3:last-child, .editable-area .span-4:last-child, .editable-area .grid .result:last-child, .grid .editable-area .result:last-child { width: 100%; } } .editable-area .span-4.last .section > .span-4.last, .editable-area .grid .last.result .section > .span-4.last, .grid .editable-area .last.result .section > .span-4.last, .editable-area .span-4.last .grid .section > .last.result, .grid .editable-area .span-4.last .section > .last.result, .editable-area .grid .last.result .section > .last.result, .grid .editable-area .last.result .section > .last.result { width: 100%; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .editable-area .span-4.last .section > .span-4.last, .editable-area .grid .last.result .section > .span-4.last, .grid .editable-area .last.result .section > .span-4.last, .editable-area .span-4.last .grid .section > .last.result, .grid .editable-area .span-4.last .section > .last.result, .editable-area .grid .last.result .section > .last.result, .grid .editable-area .last.result .section > .last.result { width: 48.8%; margin-right: 2.4%; } .editable-area .span-4.last .section > .span-4.last .component-Advert, .editable-area .grid .last.result .section > .span-4.last .component-Advert, .grid .editable-area .last.result .section > .span-4.last .component-Advert, .editable-area .span-4.last .grid .section > .last.result .component-Advert, .grid .editable-area .span-4.last .section > .last.result .component-Advert, .editable-area .grid .last.result .section > .last.result .component-Advert, .grid .editable-area .last.result .section > .last.result .component-Advert { width: 100%; } .editable-area .span-4.last .section > .span-4.last .component-RichText, .editable-area .grid .last.result .section > .span-4.last .component-RichText, .grid .editable-area .last.result .section > .span-4.last .component-RichText, .editable-area .span-4.last .grid .section > .last.result .component-RichText, .grid .editable-area .span-4.last .section > .last.result .component-RichText, .editable-area .grid .last.result .section > .last.result .component-RichText, .grid .editable-area .last.result .section > .last.result .component-RichText { width: 100%; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .editable-area .span-8#col-1 + .span-4.last .section > .span-4.last, .editable-area .grid .span-8#col-1 + .last.result .section > .span-4.last, .grid .editable-area .span-8#col-1 + .last.result .section > .span-4.last, .editable-area .span-8#col-1 + .span-4.last .grid .section > .last.result, .grid .editable-area .span-8#col-1 + .span-4.last .section > .last.result, .editable-area .grid .span-8#col-1 + .last.result .section > .last.result, .grid .editable-area .span-8#col-1 + .last.result .section > .last.result { width: 100%; } .editable-area .span-8#col-1 + .span-4.last .section > .span-4.last .component-Advert, .editable-area .grid .span-8#col-1 + .last.result .section > .span-4.last .component-Advert, .grid .editable-area .span-8#col-1 + .last.result .section > .span-4.last .component-Advert, .editable-area .span-8#col-1 + .span-4.last .grid .section > .last.result .component-Advert, .grid .editable-area .span-8#col-1 + .span-4.last .section > .last.result .component-Advert, .editable-area .grid .span-8#col-1 + .last.result .section > .last.result .component-Advert, .grid .editable-area .span-8#col-1 + .last.result .section > .last.result .component-Advert { width: 48.8%; margin-right: 2.4%; float: left; } .editable-area .span-8#col-1 + .span-4.last .section > .span-4.last .component-RichText, .editable-area .grid .span-8#col-1 + .last.result .section > .span-4.last .component-RichText, .grid .editable-area .span-8#col-1 + .last.result .section > .span-4.last .component-RichText, .editable-area .span-8#col-1 + .span-4.last .grid .section > .last.result .component-RichText, .grid .editable-area .span-8#col-1 + .span-4.last .section > .last.result .component-RichText, .editable-area .grid .span-8#col-1 + .last.result .section > .last.result .component-RichText, .grid .editable-area .span-8#col-1 + .last.result .section > .last.result .component-RichText { width: 48.8%; float: left; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .editable-area .span-4.last .section:nth-child(2) > .span-4.last, .editable-area .grid .last.result .section:nth-child(2) > .span-4.last, .grid .editable-area .last.result .section:nth-child(2) > .span-4.last, .editable-area .span-4.last .grid .section:nth-child(2) > .last.result, .grid .editable-area .span-4.last .section:nth-child(2) > .last.result, .editable-area .grid .last.result .section:nth-child(2) > .last.result, .grid .editable-area .last.result .section:nth-child(2) > .last.result { margin-right: 0; } } .no-marg { margin: 0; } /*------------------------------------* HEADER /*------------------------------------*/ #header { background: white; padding: 7.5px 0; position: relative; z-index: 1; min-height: 93px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #header { text-align: center; padding-top: 120px; min-height: 0; } #header .span-9 { width: auto; } } #header #propertynews-header-logo { width: 100%; margin: 15px 0; } #header #ad { text-align: right; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #header #ad { background: #f0f0f0; position: absolute; top: 12px; } #header #ad:after { content: "ADVERTISEMENT"; color: #d0d0d0; position: absolute; right: 0px; bottom: 0px; } } #header #logo { width: 23.6%; margin-right: 1.2%; min-width: 200px; float: left; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { #header #logo { min-width: inherit; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #header #logo { width: 200px; } } /* HOMEPAGE.SCSS ---------------------------------------------------------------------------------- */ /* +Sliders --------------------------------------------------------------------------------------- */ .hero-slider { position: relative; z-index: 0; overflow: hidden; } .hero-slider.module, .hero-slider.member--count { padding: 0 15px; } .hero-slider .item { float: left; padding: 15px; border-right: 1px solid #d6d6d6; overflow: hidden; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .hero-slider { padding: 0 22.5px; } .hero-slider .item { padding: 12px; } } .hero-wrapper { overflow: hidden; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .notepad-table { display: none; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .search-related .span-4.last:last-child .component-Advert, .search-related .grid .last.result:last-child .component-Advert, .grid .search-related .last.result:last-child .component-Advert { width: 48.8%; margin-right: 2.4%; float: left; } .search-related .span-4.last:last-child .component-Advert > .module, .search-related .grid .last.result:last-child .component-Advert > .module, .grid .search-related .last.result:last-child .component-Advert > .module, .search-related .span-4.last:last-child .component-Advert > .member--count, .search-related .grid .last.result:last-child .component-Advert > .member--count, .grid .search-related .last.result:last-child .component-Advert > .member--count { height: 272px; text-align: center; } .search-related .span-4.last:last-child .component-RichText, .search-related .grid .last.result:last-child .component-RichText, .grid .search-related .last.result:last-child .component-RichText { width: 48.8%; float: left; } .search-related .span-4.last:last-child .component-RichText > .module, .search-related .grid .last.result:last-child .component-RichText > .module, .grid .search-related .last.result:last-child .component-RichText > .module, .search-related .span-4.last:last-child .component-RichText > .member--count, .search-related .grid .last.result:last-child .component-RichText > .member--count, .grid .search-related .last.result:last-child .component-RichText > .member--count { height: 272px; } } #just-added .property { width: 211px; height: 262px; } #just-added .property-image { height: 152px; font: 0/0 a; } #just-added .property-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } #just-added .property-image > * { font: 11px sans-serif; } #just-added .property-image img { max-width: 100%; vertical-align: middle; display: inline-block; } #just-added .agent-logo { max-height: 45px; max-height: 45px; float: right; } #just-added .added { font-size: 0.9em; } #just-added h3 { font-size: 1.2em; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #just-added .property { height: 252px; } #just-added h3 { font-size: 16px; } } .slide-wrapper { overflow: hidden; position: relative; height: 458px; } .slide-wrapper img { cursor: pointer; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .slide-wrapper { width: 630px; margin: 0 auto; } } .slide-wrapper .slides { position: relative; } .slide-wrapper .slide { width: 630px; float: left; position: relative; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .slide-wrapper .slide { overflow: hidden; width: 636px; } } .slide-wrapper .masthead { margin-bottom: 15px; } .slide-wrapper .properties { margin-bottom: 15px; } .slide-wrapper .property { float: left; width: 100%; margin-right: 2.4%; width: 48.8%; } .slide-wrapper .property.last { margin-right: 0; } .slide-wrapper .main-image-only { overflow: hidden; height: 380px; } .slide-wrapper .main-image-only img { width: 100%; } .slide-wrapper h3 { margin-bottom: 0; } #featured { min-height: 508px; } #featured .main-image { width: 485px; overflow: hidden; } #featured .thumbs { position: absolute; top: 0; right: 0; height: 380px; overflow: hidden; width: 136px; } #featured .thumb-image { height: 90px; text-align: center; margin-bottom: 7.5px; background: #d2d2d2; } #featured .thumb-image img { width: auto; height: 90px; } #featured .address { margin: 15px 0 0 0; font-size: 1.8em; } #featured .agent-logo { float: right; height: 65px; padding-top: 15px; width: auto; margin-left: 7.5px; max-width: 100px; } .price-line, .other-info { margin-bottom: 0; } /* +Really Useful Stuff ------------------------------------------------------------------------------ */ #services .item { width: 292px; height: 200px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #services .item { width: 329px; } } #services .Blog h3, #services .Advice h3 { font-size: 1em; } #services #blog-list { padding: 0; border: none; margin-bottom: 7.5px; } #services .blog-entry { padding-top: 0; } #services .blog-entry img { float: left; display: block; padding: 3px; margin-right: 7.5px; margin-bottom: 7.5px; max-width: 48px; } #services .blog-entry p { font-size: 12px; margin: 0; } #services .wilson-nesbitt { text-align: center; } #services .wilson-nesbitt .medium-heading { font-size: 1.2em; margin-top: 15px; } #services .wilson-nesbitt img { float: none; } #services .iphone-app .line1 { margin-bottom: 0; } #services .iphone-app .app-store { float: left; margin: 7.5px 0; } #services .iphone-app .right { width: 50%; float: left; } #services .iphone-app .left { width: 50%; float: left; } #services .nationwide { border-color: #0e326c; height: 139px; } #services .nationwide h2 { font-size: 1.4em; } /*---------- Auction Stuff -------------------------------*/ #featured-auction-content { height: 484px; position: relative; overflow: hidden; } #featured-auction-content #slides { height: 485px; position: relative; width: 3000px; } #featured-auction-content .slide-wrapper { width: 594px; margin: 0 auto; } #featured-auction-content .slide { float: left; width: 594px; } #featured-auction-content .slide .property { float: left; width: 168px; border: 1px solid #d6d6d6; height: 300px; margin-right: 7.5px; overflow: visible; position: relative; padding: 10px; } #featured-auction-content .slide .property.last { margin-right: 0; } #featured-auction-content .slide .property h3 { height: 70px; } #featured-auction-content .slide .image-wrapper, #featured-auction-content .slide #services .blog-entry img, #services .blog-entry #featured-auction-content .slide img { width: 166px; height: 144px; } #featured-auction-content .slide .property-image { width: 158px; height: 137px; } #featured-auction-content .slide .property-image img { max-width: 158px; max-height: 136px; } #featured-auction-content .view-all-properties { text-align: right; } #featured-auction-content .auction-information-wrapper { border-bottom: 1px solid #d6d6d6; margin-bottom: 15px; padding-bottom: 15px; } #featured-auction-content .auction-information { float: left; } #featured-auction-content .more-auction-info { float: right; background: #008000; padding: 12px; } #featured-auction-content .more-auction-info h3.auction-info { padding-bottom: 3px; color: #fff; } #featured-auction-content .property img.agent-logo { float: right; height: auto; max-height: 46px; max-width: 45px; } #featured-auction-content .module-title { padding: 10px; } .component-FeaturedProperties a.all-auctions, .component-FeaturedProperties .refine-section label.all-auctions, .refine-section .component-FeaturedProperties label.all-auctions { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3); border-radius: 0 0 5px 5px; left: 15px; padding: 7.5px 15px; position: relative; top: -51px; text-decoration: none; color: white; display: block; width: 100px; } .component-FeaturedProperties a.all-auctions:hover, .component-FeaturedProperties .refine-section label.all-auctions:hover, .refine-section .component-FeaturedProperties label.all-auctions:hover { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6); } #featured-auction-content #featured-nav { position: relative; } #featured-auction-content h3.float-right { text-align: right; margin-right: 15px; font-size: 1em; } #upcoming-auctions li.auction-item { border: 1px solid #d6d6d6; margin: 0 0px 15px 0; -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); } #upcoming-auctions li.auction-item .image-wrapper, #upcoming-auctions li.auction-item #services .blog-entry img, #services .blog-entry #upcoming-auctions li.auction-item img { height: 88px; width: 116px; margin-right: 14px; float: left; } #upcoming-auctions li.auction-item .image-wrapper .property-image, #upcoming-auctions li.auction-item #services .blog-entry img .property-image, #services .blog-entry #upcoming-auctions li.auction-item img .property-image { height: 88px; width: 108px; } #upcoming-auctions li.auction-item .image-wrapper .property-image img, #upcoming-auctions li.auction-item #services .blog-entry img .property-image img, #services .blog-entry #upcoming-auctions li.auction-item img .property-image img { max-height: 80px; max-width: 138px; } .auction-splitter { border-top: 1px solid #d6d6d6; } #upcoming-auctions ul li.auction-item .info-wrapper { float: left; width: 560px; padding-top: 10px; } #upcoming-auctions ul li.auction-item.last { margin-right: 0; } #upcoming-auctions ul li.auction-item .information { padding: 10px; } #upcoming-auctions ul li.auction-item .information .auction-date { background: #008000; margin-left: -11px; margin-top: -11px; padding: 8px; width: 290px; margin-bottom: 12px; } #upcoming-auctions ul li.auction-item .information .auction-date h3 { margin: 0; font-size: 16px; color: #fff; } span.auction-icon { background-image: url(/images/pn-sprite.png) !important; background-repeat: no-repeat; background-position: 1px 1px; margin-right: 8px; display: block; width: 16px; height: 18px; float: left; } span.auction-icon.where { background-position: -17px -232px; } span.auction-icon.date { background-position: -41px -232px; } span.auction-icon.time { background-position: -63px -232px; } span.auction-icon.hammer { background-position: -40px -255px; } span.auction-icon.properties { background-position: -81px -231px; } span.auction-icon.date-white { background-position: -40px -207px; } span.auction-icon.time-white { background-position: -62px -208px; } #upcoming-auctions ul li.auction-item .information ul li a, #upcoming-auctions ul li.auction-item .information ul li .refine-section label, .refine-section #upcoming-auctions ul li.auction-item .information ul li label { font-size: 12px; } .brochure-left .auction-promo-image { float: right; padding: 0 0 10px 10px; } /*------------------------------------* ICONS /*------------------------------------*/ @font-face { font-family: "SSStandard-web"; src: url("/fonts/ss-standard.eot"); src: url("/fonts/ss-standard.eot?#iefix") format("embedded-opentype"), url("/fonts/ss-standard.woff") format("woff"), url("/fonts/ss-standard.ttf") format("truetype"), url("/fonts/ss-standard.svg#SSStandard") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "SSSocial"; src: url("/fonts/ss-social-regular.eot"); src: url("/fonts/ss-social-regular.eot?#iefix") format("embedded-opentype"), url("/fonts/ss-social-regular.woff") format("woff"), url("/fonts/ss-social-regular.ttf") format("truetype"), url("/fonts/ss-social-regular.svg#SSSocial") format("svg"); font-weight: normal; font-style: normal; } .ss-icon, .ui-dialog-titlebar-close, .close-icon, .module__close, .area-picker li:after, .recent-searches li:after, .recent-searches li:before, .ss-social, [class^="ss-"]:before, [class*=" ss-"]:before { font-family: "SSStandard-web"; font-size: 0.9em; text-decoration: none; white-space: nowrap; vertical-align: middle; font-weight: normal; text-rendering: optimizeLegibility; -webkit-font-feature-settings: "liga", "dlig"; -ms-font-feature-settings: "liga", "dlig"; -o-font-feature-settings: "liga", "dlig"; font-feature-settings: "liga", "dlig"; } .ss-icon .after, .ui-dialog-titlebar-close .after, .close-icon .after, .module__close .after, .area-picker li:after .after, .recent-searches li:after .after, .recent-searches li:before .after, .ss-social .after, [class^="ss-"]:before .after, [class*=" ss-"]:before .after { margin-left: 7.5px; } .ss-social { font-family: "SSSocial"; } .icon-beside { position: relative; top: 1px; } .standard-icon, .standard-icon--success, .standard-icon--dark { color: #d5d4d4; margin-right: 5px; font-size: 14px; display: inline-block; } .standard-icon { color: #d5d4d4; } .standard-icon--success { color: #3AC337; } .standard-icon--dark { color: #333; } .rss-icon { background: orange; color: white; padding: 3.75px 5px; border-radius: 3px 3px 3px 3px; } /* +Images -------------------------------------------------------------------------------------------- */ img { vertical-align: middle; } .image-wrapper, #services .blog-entry img { border: 1px solid #d6d6d6; -webkit-box-shadow: 1px 1px 3px #ccc; box-shadow: 1px 1px 3px #ccc; position: relative; margin-bottom: 15px; text-align: center; width: 100%; } .property-image, .item-image { background: #d2d2d2; display: block; overflow: hidden; border: 4px solid #fff; vertical-align: middle; } /*------------------------------------* LINK /ref/patterns.php#link /*------------------------------------*/ .link--b { color: #2771c4; cursor: pointer; } .link--b:hover { color: #6fa5e2; } .link--b:visited { color: #3372b8; } .link--b:active { color: #2771c4; } input.link { cursor: pointer; } /*------------------------------------* LISTS /*------------------------------------*/ ul, ol { padding-left: 0; margin: 0; list-style: none; } ul ul, ul ol, ol ul, ol ol { margin: 0 0 0 15px; } .list--stacked { list-style: none; margin-left: 0; } .list--stacked dd, .list--stacked li { margin-left: 0; } .list--stacked * > a:only-child, .list--stacked .refine-section * > label:only-child, .refine-section .list--stacked * > label:only-child { display: block; } .list--stacked > * { margin-bottom: 2px; } .inline-list, .pipe-list, .pager { margin-bottom: 0; } .inline-list > li, .pipe-list > li, .pager > li { display: inline-block; margin-right: 7.5px; vertical-align: top; } .pipe-list li { border-left: 1px solid #d6d6d6; margin: 0; padding: 0 7.5px; } .pipe-list li:first-child { border-left: 0; padding-left: 0; } .component-RichText ul, .component-RichText ol { margin-bottom: 15px; } .tabbed-list, .tabbed-list--full, .tabbed-list--plain { font-weight: bold; display: table; border-collapse: separate; border-spacing: 2px 0; position: relative; margin: 0 0 0 -2px; } .tabbed-list > li, .tabbed-list--full > li, .tabbed-list--plain > li { display: table-cell; background: #f5f3ef; vertical-align: middle; } .tabbed-list > li a, .tabbed-list--full > li a, .tabbed-list--plain > li a, .tabbed-list > li .refine-section label, .refine-section .tabbed-list > li label, .tabbed-list--full > li .refine-section label, .refine-section .tabbed-list--full > li label, .tabbed-list--plain > li .refine-section label, .refine-section .tabbed-list--plain > li label { float: left; display: block; padding: 7.5px 15px; text-decoration: none; color: #333; } .tabbed-list > li.current, .tabbed-list--full > li.current, .tabbed-list--plain > li.current { background: white; } .rounded.tabbed-list li, .rounded.tabbed-list--full li, .rounded.tabbed-list--plain li { border-radius: 5px 5px 0 0; } .tabbed-list li.tint a, .tabbed-list--full li.tint a, .tabbed-list--plain li.tint a, .tabbed-list li.tint .refine-section label, .refine-section .tabbed-list li.tint label, .tabbed-list--full li.tint .refine-section label, .refine-section .tabbed-list--full li.tint label, .tabbed-list--plain li.tint .refine-section label, .refine-section .tabbed-list--plain li.tint label { background: #D23722; color: white; } .tabbed-list li.tint a:hover, .tabbed-list--full li.tint a:hover, .tabbed-list--plain li.tint a:hover, .tabbed-list li.tint .refine-section label:hover, .refine-section .tabbed-list li.tint label:hover, .tabbed-list--full li.tint .refine-section label:hover, .refine-section .tabbed-list--full li.tint label:hover, .tabbed-list--plain li.tint .refine-section label:hover, .refine-section .tabbed-list--plain li.tint label:hover { background: #bc311e; color: white; } .tabbed-list--full { border-spacing: 0; width: 100%; margin: 0; } .tabbed-list--full > li { border-right: 1px solid #d6d6d6; } .tabbed-list--full > li:first-child { border-left: 1px solid #d6d6d6; } .tabbed-list--full > li:last-child { border: none; } .tabbed-list--full > li:last-child a, .tabbed-list--full > li:last-child .refine-section label, .refine-section .tabbed-list--full > li:last-child label { -webkit-box-sizing: content-box; box-sizing: content-box; } .tabbed-list--full > li a, .tabbed-list--full > li .refine-section label, .refine-section .tabbed-list--full > li label { text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; padding: 20px 7.5px; } .tabbed-list--full > li a:hover, .tabbed-list--full > li .refine-section label:hover, .refine-section .tabbed-list--full > li label:hover { background: #efece5; } .tabbed-list--full > li.current { background: #333; } .tabbed-list--full > li.current a, .tabbed-list--full > li.current .refine-section label, .refine-section .tabbed-list--full > li.current label { color: white; } .tabbed-list--full > li.current a:hover, .tabbed-list--full > li.current .refine-section label:hover, .refine-section .tabbed-list--full > li.current label:hover { background: #333; } .tabbed-list--plain > li, .tabbed-list--plain > li.current { background: transparent !important; } .bordered-list > li, .range-drop-down ul > li, .search-list > li, .bordered-list--b > li, .list-with-icon > li { border-top: 1px solid #d6d6d6; padding: 7.5px; } .bordered-list > li:first-child, .range-drop-down ul > li:first-child, .search-list > li:first-child, .bordered-list--b > li:first-child, .list-with-icon > li:first-child { border-top: none; } .bordered-list--b > li { padding: 15px 7.5px; } .bulleted-list, .list-with-icon { margin-bottom: 15px; } .bulleted-list li, .list-with-icon li { list-style: disc; margin-left: 1em; } .list-with-icon li { margin-left: 0; list-style-position: inside; } dd { margin: 0 0 1.2% 0; } .list--selections > * { background: #fcfcfc; border: 1px solid #e3e3e3; padding: 7.5px; border-radius: 5px; color: #a3a3a3; position: relative; } .list--selections > *:after { content: '✓'; font-family: "SSStandard-web"; color: #d6d6d6; position: absolute; top: 0px; right: 15px; line-height: 36px; } .list--selections > *:hover { border-color: #333333; color: #333333; cursor: pointer; background: #e3e3e3; } .list--selections > *:hover:after { color: #333333; } .list--selections a, .list--selections .refine-section label, .refine-section .list--selections label { text-decoration: none; color: #333333; } .list--selections .selected { border: 1px solid #94e594; background: #e6f9e6; font-weight: bold; color: forestgreen; } .list--selections .selected:after { color: forestgreen; } .list--selections .selected a, .list--selections .selected .refine-section label, .refine-section .list--selections .selected label { color: forestgreen; } .list--table, .fs-slideshow__nav .tabbed-list--slideshow { display: table; list-style: none; margin: 0; padding: 0; width: 100%; } .list--table > *, .fs-slideshow__nav .tabbed-list--slideshow > * { display: table-cell; vertical-align: middle; padding: 0 5px; text-align: center; } .dialog .loading-spinner, .dialog--large .loading-spinner { position: absolute; top: 50%; right: 50%; margin-top: -25px; margin-right: -25px; } .dialog .loading-spinner img, .dialog--large .loading-spinner img { width: 50px; width: 50px; } .loading-spinner--relative { text-align: center; position: relative; text-align: center; padding: 15px 0; } .loading-spinner--relative img { width: 50px; width: 50px; } /*------------------------------------* MENUS /*------------------------------------*/ .menu__tab { position: relative; padding: 0 16px; } .menu__tab > .ss-icon, .menu__tab > .ui-dialog-titlebar-close, .menu__tab > .close-icon, .menu__tab > .module__close, .area-picker .menu__tab > li:after, .recent-searches .menu__tab > li:after, .recent-searches .menu__tab > li:before { font-size: 10px; color: #2771c4; } .menu__tab.active { border: 1px solid #b0b0b0; border-bottom: none; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); padding: 15px 15px 7.5px 15px; position: relative; z-index: 7001; background: white; } .menu__tab.active:after { content: ''; background: white; position: absolute; display: block; height: 10px; z-index: 7002; left: 0px; bottom: -6px; width: 100%; } .menu--drop-down { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; min-width: 225px; right: 0; } .menu--drop-down li { padding: 5px; color: #A3A3A3; } .menu--drop-down li:hover { cursor: pointer; background: #e5edf3; } .menu--drop-down li:first-child { border-top: none; } .menu--drop-down .selected { background: #e2f1fe; font-weight: bold; color: #333; } .menu__list { margin: 0; text-align: left; padding: 7.5px 0; } .menu__list > li { padding: 7.5px 0; border-top: 1px solid #d6d6d6; margin: 0 15px; } .menu__list > li:hover { background: transparent; } .menu__contrast-area { background: #e5edf3; padding: 15px; } /*------------------------------------* MEDIA ITEM Designed to although you to quickly place an image and body of text beside each other /ref/patterns.php#media-item /*------------------------------------*/ .context-info, .media-item { margin-bottom: 15px; margin-bottom: 15px; display: block; } @media only screen and (max-width: 48em) { .context-info, .media-item { margin-bottom: 14.25px; margin-bottom: 14.25px; } } @media only screen and (max-width: 30em) { .context-info, .media-item { margin-bottom: 13.5px; margin-bottom: 13.5px; } } .context-info:last-child, .media-item:last-child { margin-bottom: 0; } .context-info__image, .media-item__image { margin-right: 15px; margin-right: 15px; float: left; } .context-info__image img, .media-item__image img { width: 100%; } .context-info__body, .media-item__body { overflow: hidden; margin-bottom: 0; } .context-info__body > :last-child, .media-item__body > :last-child { margin-bottom: 0; } /*------------------------------------* MODULES The standard module on propertynews /*------------------------------------*/ .ui-dialog, .module, .member--count, .module--modal { background: white; border-radius: 5px 5px 5px 5px; padding: 15px; margin-bottom: 15px; } .tabbed-module.ui-dialog, .tabbed-module.module, .tabbed-module.member--count, .tabbed-module.module--modal { border-radius: 5px 5px 5px; } .mpu.ui-dialog, .mpu.module, .mpu.member--count, .mpu.module--modal { padding: 15px 9px; text-align: center; min-height: 269px; } .with-side-panel.ui-dialog, .with-side-panel.module, .with-side-panel.member--count, .with-side-panel.module--modal { position: relative; } .padded.ui-dialog, .padded.module, .padded.member--count, .padded.module--modal { padding: 22.5px; } .module__header--with-border { padding: 30px; } /* Base module classes */ .module__content { position: relative; } .module__close { top: 0; right: 0; } .module__media { margin-bottom: 15px; width: 100%; } .module__media > * { width: 100%; } .module__header--with-border { margin: -15px; margin-bottom: 15px; border-bottom: 1px solid #d6d6d6; } @media only screen and (max-width: 48em) { #c-7 .module, #c-7 .member--count { min-height: 272px; } } .pagelets-module.padded, .double-padded { padding: 30px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .module, .member--count { padding: 12px; margin-bottom: 12px; } .module.double-padded, .double-padded.member--count { padding: 24px; } } /* Alternative Style */ .alternate-module { background: #f9f7f5; padding: 15px; border: 1px solid #e5e0d6; margin: 0 0 15px 0; } .alternate-module p, .alternate-module ul { margin: 0; } /* Module Titles */ .module-title { padding: 7.5px; margin-bottom: 15px; position: relative; } .module-title .small-heading, .module-title h3 { margin: 0; font-size: 1.4em; } .module-title .ss-icon, .module-title .ui-dialog-titlebar-close, .module-title .close-icon, .module-title .module__close, .module-title .area-picker li:after, .area-picker .module-title li:after, .module-title .recent-searches li:after, .recent-searches .module-title li:after, .module-title .recent-searches li:before, .recent-searches .module-title li:before { position: absolute; right: 7.5px; text-decoration: none; top: 7.5px; font-size: 16px; } .tabbed.module-title { padding-bottom: 0; } .tabbed.module-title li { background: #e88072; } .tabbed.module-title a, .tabbed.module-title .refine-section label, .refine-section .tabbed.module-title label { color: white; } .tabbed.module-title .selected, .tabbed.module-title li:hover { background: white; } .tabbed.module-title .selected a, .tabbed.module-title .selected .refine-section label, .refine-section .tabbed.module-title .selected label, .tabbed.module-title li:hover a, .tabbed.module-title li:hover .refine-section label, .refine-section .tabbed.module-title li:hover label { color: #333; } /* Secondary module */ .secondary.module .module-title, .secondary.member--count .module-title { background: #075ca7; } /* Modules at the bottom of lists */ .module.bottom, .bottom.member--count { border-radius: 0 0 5px 5px; } /* Popover modules */ .module--modal { position: absolute; z-index: 8000; -webkit-box-shadow: 0 0 30px #807f7f; box-shadow: 0 0 30px #807f7f; max-width: 300px; } .module__arrow--top { width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 15px solid white; position: absolute; top: -11px; left: 50%; margin-left: -15px; } .recent-searches .module__arrow--top { -webkit-text-shadow: 0 -1px 0px #8a8989; -moz-text-shadow: 0 -1px 0px #8a8989; text-shadow: 0 -1px 0px #8a8989; font-size: 10px; top: -9px; right: 75px; left: auto; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .recent-searches .module__arrow--top { right: 100px; } } .module__arrow--bottom { width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 15px solid white; position: absolute; bottom: -11px; left: 50%; margin-left: -15px; } .module__arrow--right { width: 0; height: 0; border-bottom: 15px solid transparent; border-top: 15px solid transparent; border-left: 15px solid white; position: absolute; top: 50%; right: -11px; margin-top: -15px; } .module__arrow--left { width: 0; height: 0; border-bottom: 15px solid transparent; border-top: 15px solid transparent; border-right: 15px solid white; position: absolute; top: 50%; left: -11px; margin-top: -15px; } /* +New Modules ------------------------------------------------------------------------ */ .bgimg-module { padding: 45px; } @media only screen and (max-width: 48em) { .bgimg-module { padding: 15px; } } .bgimg-module__header { margin-bottom: 30px; } .bgimg-module__header:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .bgimg-module__inner-content { background: white; border-radius: 5px; position: relative; z-index: 1; } .bgimg-module__inner-content:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .bgimg-module__inner-content-section { background: #F6F6F6; padding: 15px; margin-left: -30px; margin-right: -30px; } .bgimg-module__inner-content-section:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .bgimg-module__inner-content-section.top { -webkit-box-shadow: inset 0px -1px 2px #e3e3e3; box-shadow: inset 0px -1px 2px #e3e3e3; margin-top: -30px; margin-bottom: 30px; border-radius: 5px 5px 0 0; border-bottom: 1px solid #cecece; } .bgimg-module__inner-content-section.bottom { margin-bottom: -30px; margin-top: 30px; border-radius: 0 0 5px 5px; } .bgimg-module img { max-width: 100%; } .bgimg-module__section { position: relative; padding: 22px 45px; } .bgimg-module__section:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .bgimg-module__section.bottom { border-radius: 0 0 5px 5px; margin-bottom: -45px; margin-left: -45px; margin-right: -45px; } .bgimg-module__section.underlap { z-index: 0; padding-top: 36px; margin-top: -28px; } .bgimg-module__section.dark { background: #333; color: white; } @media only screen and (max-width: 48em) { .bgimg-module__section.bottom { margin: -15px; margin-top: -30px; border-radius: 0; } } .box { padding: 0; margin-bottom: 15px; } .box__content, .box__content--bb { padding: 15px; } .box__content--bb { border-bottom: 1px solid white; } .box--white { background: white; } .box--secondary-tint { background: #e5edf3; } /* Members Area (Temp location for styles) ------------------------------------------------------------------------ */ .module--members { height: 422px; position: relative; } .member--count { background: #bc311e; padding: 6px 10px; font-size: 0.8em; } .hidden-item { display: none; } .module--placeholder { background: #f8f8f8; min-height: 275px; padding: 37.5px; color: #9f9f9f; } .module--placeholder_image { display: block; margin: 30px auto; } .module--placeholder_button { margin: 0 auto; display: block; width: 60%; } .module--link { position: absolute; margin: 0 auto; left: 0; right: 0; bottom: 7.5px; } .module--list li { padding: 10px; } .module--list li:nth-child(odd) { background: #f8f8f8; } .module--list_details li { padding-top: 7.5px; } .module--list_details li:last-child { padding-top: 15px; } .logout { color: #D23722; } .reduced-width { width: 30%; } .module-center { text-align: center; } /*------------------------------------* NAV /*------------------------------------*/ #nav { font-size: 14px; width: 1000px; margin: 0 auto; } #nav li { background: #a62c1b; } #nav li:hover { background: #e15846; } #nav li.selected { background: #D23722; } #nav li.agents { background: #075ca7; } #nav li.agents:hover { background: #0977d8; } #nav li a, #nav li .refine-section label, .refine-section #nav li label { color: white; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #nav li a, #nav li .refine-section label, .refine-section #nav li label { padding: 7.5px 8px; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #nav { width: 98%; font-size: 12px; } #nav li span { display: none; } } /*------------------------------------* PAGER /*------------------------------------*/ .pager { font-weight: bold; } .pager li { border: 1px solid #d6d6d6; border-left: 0; margin: 0; background: white; } .pager li:first-child { border-left: 1px solid #d6d6d6; } .pager li:hover { background: white; } .pager li:hover a, .pager li:hover .refine-section label, .refine-section .pager li:hover label { color: #333; } .pager a, .pager .refine-section label, .refine-section .pager label { text-decoration: none; color: #A3A3A3; display: block; padding: 5px 7.5px; } .pager .current { background: #D23722; color: white; padding: 5px 7.5px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .pager a, .pager .refine-section label, .refine-section .pager label, .pager .current { padding: 10px 15px; } } .bottom .pager { text-align: right; } /* Styles for promotional popup ------------------------------------------------------------------------ */ .fancybox-inner[style] { overflow: visible !important; } #popup-ad, #second-popup-ad { border-radius: 2.5px; padding: 60px 45px 15px 45px; } #popup-ad img, #second-popup-ad img { max-width: 100%; width: auto; } #popup-ad .title-section h1, #second-popup-ad .title-section h1 { font-size: 36px; text-transform: uppercase; } #popup-ad .title-section h2, #second-popup-ad .title-section h2 { font-size: 22px; margin-bottom: 30px; } #popup-ad .title-section.white, #second-popup-ad .title-section.white { color: #ffffff; } #popup-ad .title-section.white h1, #popup-ad .title-section.white h2, #second-popup-ad .title-section.white h1, #second-popup-ad .title-section.white h2 { -webkit-text-shadow: 0px 2px 2px #333333; -moz-text-shadow: 0px 2px 2px #333333; text-shadow: 0px 2px 2px #333333; } #popup-ad a.button, #popup-ad a.module--placeholder_button, #popup-ad .refine-section label.module--placeholder_button, .refine-section #popup-ad label.module--placeholder_button, #popup-ad .refine-section label.button, .refine-section #popup-ad label.button, #popup-ad .refine-section label.area-picker-button, .refine-section #popup-ad label.area-picker-button, #popup-ad .refine-section label.price-range-drop-down-arrow, .refine-section #popup-ad label.price-range-drop-down-arrow, #popup-ad a.area-picker-button, #popup-ad a.price-range-drop-down-arrow, #second-popup-ad a.button, #second-popup-ad a.module--placeholder_button, #second-popup-ad .refine-section label.module--placeholder_button, .refine-section #second-popup-ad label.module--placeholder_button, #second-popup-ad .refine-section label.button, .refine-section #second-popup-ad label.button, #second-popup-ad .refine-section label.area-picker-button, .refine-section #second-popup-ad label.area-picker-button, #second-popup-ad .refine-section label.price-range-drop-down-arrow, .refine-section #second-popup-ad label.price-range-drop-down-arrow, #second-popup-ad a.area-picker-button, #second-popup-ad a.price-range-drop-down-arrow { font-size: 18px !important; margin-bottom: 7.5px; } .new-feature-wrap, .new-feature-wrap--top, .new-feature-wrap--bottom { position: absolute; z-index: 99999; } .new-feature-wrap--top { left: -22px; top: -24px; } .new-feature-wrap--bottom { right: -25px; bottom: -24px; } .enhance-property-promo { background: url("/images/popup/enhanced-bg.jpg") 17% -470px !important; } .enhance-property-promo .features { -webkit-box-shadow: 0px 1px 4px #888888; box-shadow: 0px 1px 4px #888888; background: white; margin-bottom: 15px; } .enhance-property-promo .features:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .enhance-property-promo .features .media-item { text-align: left; float: left; width: 50%; } .enhance-property-promo .features .media-item h3 { margin-bottom: 10px; text-align: center; } .enhance-property-promo .features .media-item p { text-align: center; } .enhance-property-promo .features .media-item .inner { padding: 15px; border-right: 1px solid #e3e3e3; } .enhance-property-promo .features .media-item.last .inner { border: none; } .enhance-property-promo .features .media-item img { width: 100%; margin-bottom: -16px; } .pricing { border: 1px solid #d8d8d8; padding: 7.5px; background: #f7f7f7; } .winter { background: url("/images/popup/enhanced-bg-winter.jpg") 17% -470px !important; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .fancybox-wrap[style] { width: 90% !important; min-width: 200px !important; } .fancybox-inner[style] { width: 100% !important; } .enhance-property-promo { padding: 25px 25px 15px 25px; } } /*------------------------------------* PASSWORD STRENGTH METER /*------------------------------------*/ .strength-meter__wrapper { position: relative; margin-right: -2px; margin-left: -2px; } .strength-meter { display: table; width: 100%; height: 4px; margin-top: 2px; border-collapse: separate; border-spacing: 2px 0; } .strength-meter__item { display: table-cell; background: #e1dbcf; height: 3.75px; } .strength--weak { color: #c95757; } .strength--weak.strength-meter__item { background: #c95757; } .strength--medium { color: #e19e22; } .strength--medium.strength-meter__item { background: #e19e22; } .strength--strong { color: #378f45; } .strength--strong.strength-meter__item { background: #378f45; } /* Promoted Properties */ .promo-tag { background: url("/images/sitefiles/enhanced/promo-tag.svg") right center; background-size: 200px 30px; color: white; display: none; } .promo-tag span { font-weight: bold; font-size: 1.2em; line-height: 29px; padding-left: 18px; } .result.promo { background: #fdecce; overflow: visible; border: 3px solid #face7f !important; padding-bottom: 60px; -webkit-box-sizing: border-box; box-sizing: border-box; } .result.promo .promo-tag { display: block; position: absolute; bottom: 15px; left: -5px; height: 29px; width: 170px; } .result.promo .standard-icon { color: #F8BB4E; } .result.promo .agent-logo, .result.promo .agent-logo-two { bottom: 52.5px; } .grid .result.promo { padding: 12px 15px; } .grid .result.promo p.added { visibility: hidden; } /*------------------------------------* PROPERTY LIST A list of result items Can be stacked vertically or in a grid /*------------------------------------*/ .property-list--grid > * { padding: 0; width: 20%; float: left; } .property-list--grid .result__details { padding-right: 15px; } .property-list--grid .result--thumbnail { min-height: 190px; } .property-list--grid .result__image--thumb .property-image { height: 63px; font: 0/0 a; } .property-list--grid .result__image--thumb .property-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .property-list--grid .result__image--thumb .property-image > * { font: 11px sans-serif; } .property-list--grid .result__image--thumb .property-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .property-list--grid .result__image--thumb { float: none; } .property-list--stacked .result__image--thumb { float: left; width: 60px; } .property-list--stacked .result__image--thumb .property-image { height: 42px; font: 0/0 a; } .property-list--stacked .result__image--thumb .property-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .property-list--stacked .result__image--thumb .property-image > * { font: 11px sans-serif; } .property-list--stacked .result__image--thumb .property-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .new-registrations { background: url(/images/registrations/background.jpg) no-repeat top center white; } @media only screen and (max-width: 48em) { .new-registrations .bgimg-module__header .col, .new-registrations .bgimg-module__header .grid .result, .grid .new-registrations .bgimg-module__header .result { float: none; margin: 0; } .new-registrations .bgimg-module__header .span-6 { display: none; } .new-registrations .bgimg-module__header .span-6.devices { display: block; margin: 0 auto; } } @media only screen and (max-width: 480px) { .new-registrations .bgimg-module__header .col, .new-registrations .bgimg-module__header .grid .result, .grid .new-registrations .bgimg-module__header .result { float: none; margin: 0; } .new-registrations .bgimg-module__header .span-6 { display: none; } .new-registrations .bgimg-module__header .span-6.devices { display: block; margin: 0 auto; } } .new-registrations .bgimg-module__inner-content { background: #eeeeee; padding: 30px; } .new-registrations .bgimg-module__inner-content-section.top { display: block; } .new-registrations .bgimg-module__inner-content-section.top h3 { margin-bottom: 7.5px; } .new-registrations .bgimg-module__inner-content-section.top.mobile { display: none; } @media only screen and (max-width: 48em) { .new-registrations .bgimg-module__inner-content-section.top.desktop { display: none; } .new-registrations .bgimg-module__inner-content-section.top.mobile { display: block; } } /*------------------------------------* NEW RESULT Individual result item /*------------------------------------*/ /* Standard result item */ .result { background: white; padding: 22.5px; position: relative; } /* List result item */ .list .result { border-bottom: 1px solid #d6d6d6; } .list .top.result { border-radius: 5px 5px 0 0; } .list .result .result__address--short { display: none; } /* Grid results */ .grid .result { border-radius: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 15px; margin-bottom: 15px; } .grid .result .result__address--full, .grid .result .result__location { display: none; } .grid .last.result { margin-right: 0; } .grid .result .hide { height: 497px; } .result.mini { padding: 15px 0; } .result.micro { padding: 9px; } .result.login-context { padding: 7.5px; border: 1px dotted #d6d6d6; } /* Address */ .result__address--full, .result__title--full, .result__address--short { margin: 0; padding: 0 0 7.5px 0; font-weight: normal; } .hide .result__address--full, .hide .result__title--full, .hide .result__address--short { margin: 0; padding: 0 100px 0 0; line-height: 1; } .grid .hide .result__address--full, .grid .hide .result__title--full, .grid .hide .result__address--short { padding: 0; line-height: 1.6em; } .result--thumbnail .result__address--full, .result--thumbnail .result__title--full, .result--thumbnail .result__address--short { font-size: 12px; height: auto; } .mini .result__address--full, .mini .result__title--full { font-size: 14px; padding-bottom: 7.5px; } .mini .result__address--full a, .mini .result__address--full .refine-section label, .refine-section .mini .result__address--full label, .mini .result__title--full a, .mini .result__title--full .refine-section label, .refine-section .mini .result__title--full label { font-size: 14px; } .login-context .result__address--full, .login-context .result__title--full { font-size: 14px; font-weight: bold; } .result__address--short { font-size: 18px; height: 58.5px; overflow: hidden; } /* Price */ .result__price, .result__subtitle { font-size: 20px; font-weight: normal; } .grid .result__price, .grid .result__subtitle { font-size: 18px; height: 45px; overflow: hidden; } .mini .result__price, .mini .result__subtitle { font-size: 12px; margin-bottom: 3.75px; } .login-context .result__price, .login-context .result__subtitle { font-size: 14px; color: #D23722; } .result--thumbnail .result__price, .result--thumbnail .result__subtitle { font-size: 12px; } /* Property Images */ .result__image { float: left; margin-right: 22.5px; width: 228px; } .result__image .tag--photo { bottom: 4px; left: 4px; top: auto; } .result__image .property-image, .result__image .item-image { height: 145px; font: 0/0 a; } .result__image .property-image:before, .result__image .item-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .result__image .property-image > *, .result__image .item-image > * { font: 11px sans-serif; } .result__image .property-image img, .result__image .item-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .grid .result__image { margin-right: 0; float: none; width: auto; } .grid .result__image .image-wrapper, .grid .result__image #services .blog-entry img, #services .blog-entry .grid .result__image img { width: 100%; } .grid .result__image .property-image, .grid .result__image .item-image { height: 155px; font: 0/0 a; } .grid .result__image .property-image:before, .grid .result__image .item-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .grid .result__image .property-image > *, .grid .result__image .item-image > * { font: 11px sans-serif; } .grid .result__image .property-image img, .grid .result__image .item-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .micro .result__image { height: 58px; margin-right: 7.5px; } .micro .result__image img { height: 100%; } .result--thumbnail .result__image { margin-right: 15px; } .result__image--small .property-image { height: 110px; font: 0/0 a; } .result__image--small .property-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .result__image--small .property-image > * { font: 11px sans-serif; } .result__image--small .property-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .result__image--mini { width: 100px; } .result__image--mini .property-image, .result__image--mini .item-image { height: 70px; font: 0/0 a; } .result__image--mini .property-image:before, .result__image--mini .item-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .result__image--mini .property-image > *, .result__image--mini .item-image > * { font: 11px sans-serif; } .result__image--mini .property-image img, .result__image--mini .item-image img { max-width: 100%; vertical-align: middle; display: inline-block; } .result__image--thumb { float: left; margin-right: 22.5px; } .result__image--thumb .property-image { height: 80px; font: 0/0 a; border-width: 2px; } .result__image--thumb .property-image:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } .result__image--thumb .property-image > * { font: 11px sans-serif; } .result__image--thumb .property-image img { max-width: 100%; vertical-align: middle; display: inline-block; } /* Property details */ .result__details { display: table-cell; width: 9999px; } .login-context .result__details { padding: 7.5px 0; text-align: left; } .grid .result__details { position: relative; } .grid .result__details .agent-logo, .grid .result__details .agent-logo-two { top: 63px; bottom: inherit; right: 0; max-width: 45px; max-height: 45px; } .grid .result__details .agent-logo-two { right: 52.5px; } .result__details .agent-logo, .result__details .agent-logo-two { position: absolute; bottom: 37.5px; right: 10px; max-width: 60px; max-height: 60px; } .result__details .agent-logo-two { right: 77.5px; } .micro .result__details { width: auto; text-align: left; } .development .result__price { font-size: 15px; font-size: 15px; } @media only screen and (max-width: 48em) { .development .result__price { font-size: 14.25px; font-size: 14.25px; } } @media only screen and (max-width: 30em) { .development .result__price { font-size: 13.5px; font-size: 13.5px; } } .development .result__summary > * { margin: 0px; } .grid .development .result__summary > * { display: inline; } .result__location { font-weight: normal; color: #a3a3a3; } .grid .result__location { font-size: 15px; font-size: 15px; } @media only screen and (max-width: 48em) { .grid .result__location { font-size: 14.25px; font-size: 14.25px; } } @media only screen and (max-width: 30em) { .grid .result__location { font-size: 13.5px; font-size: 13.5px; } } .result__address--full { font-weight: normal; color: #a3a3a3; } .result__address--full a, .result__address--full .refine-section label, .refine-section .result__address--full label { font-size: 19px; font-size: 19px; } @media only screen and (max-width: 48em) { .result__address--full a, .result__address--full .refine-section label, .refine-section .result__address--full label { font-size: 18.05px; font-size: 18.05px; } } @media only screen and (max-width: 30em) { .result__address--full a, .result__address--full .refine-section label, .refine-section .result__address--full label { font-size: 17.1px; font-size: 17.1px; } } /* Property action buttons */ .result__actions { clear: both; } .hide .result__actions { position: absolute; top: 15px; right: 15px; } .result__actions > ul { float: left; line-height: 30px; } .result__actions > .added { float: right; width: 25%; text-align: right; line-height: 1.2em; margin: 0; } .grid .result__actions { position: relative; right: auto; height: 120px; } .grid .result__actions > * { float: none; width: 100%; text-align: left; } .grid .result__actions .added { margin-top: 15px; height: 30px; overflow: hidden; } .grid .result__actions .button, .grid .result__actions .module--placeholder_button, .grid .result__actions .area-picker-button, .grid .result__actions .price-range-drop-down-arrow { margin-bottom: 7.5px; } .grid .result__actions li { margin: 0; display: block; } .grid .result__actions .FavouriteItemAjax > div, .grid .result__actions .RemovedPropertyAjaxToggle > div > a, .grid .result__actions .refine-section .RemovedPropertyAjaxToggle > div > label, .refine-section .grid .result__actions .RemovedPropertyAjaxToggle > div > label { width: 100%; margin-bottom: 7.5px; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; } .grid .result__actions .share-property { display: none; } .hide .result__actions .FavouriteItemAjax > div, .hide .result__actions .share-property, .hide .result__actions .add-to-favourites-button { display: none; } .result__actions .RemovedPropertyAjaxToggle .hidden-message { display: none; } .hide .result__actions .RemovedPropertyAjaxToggle > div > a, .hide .result__actions .refine-section .RemovedPropertyAjaxToggle > div > label, .refine-section .hide .result__actions .RemovedPropertyAjaxToggle > div > label { position: absolute; top: 15px; right: 15px; } .grid .hide .result__actions .RemovedPropertyAjaxToggle > div > a, .grid .hide .result__actions .refine-section .RemovedPropertyAjaxToggle > div > label, .refine-section .grid .hide .result__actions .RemovedPropertyAjaxToggle > div > label { position: relative; left: auto; right: auto; } /* Property summary */ .result__summary { list-style: none; margin-left: 0; padding-right: 75px; } .result__summary dd, .result__summary li { margin-left: 0; } .result__summary * > a:only-child, .result__summary .refine-section * > label:only-child, .refine-section .result__summary * > label:only-child { display: block; } .result__summary > * { display: inline-block; vertical-align: baseline; } .result__summary > * { margin-right: 15px; } .result__summary .property-status { font-weight: bold; color: #d23722; } .result__summary .property-beds { font-weight: bold; } .grid .result__summary { padding-right: 45px; height: 75px; overflow: hidden; } .grid .result__summary > * { display: block; } .mini .result__summary { padding-right: 0; margin-bottom: 5px; } /* Promoted Properties */ .promo-tag { display: none; } /* Part of developments */ .result__development { padding: 7.5px 0; margin: 0; } .grid .result__development { display: none; } .result__development--additional { display: none; } /* View on map */ .result__view-map { margin-bottom: 15px; } .grid .result__view-map { display: none; } /* New Homes Results */ .grid .result.development { min-height: 440px; } .grid .result.development .result__actions { position: absolute; right: 15px; bottom: 15px; left: 15px; height: 33px; } .grid .result.development .result__address--full { display: block; min-height: 53px; } .grid .result.development .agent-logo { top: 83px; } .result.development .result__address--full { display: block; } .result__drag-handle { position: absolute; left: 4px; top: 9px; color: #cecece; cursor: move; display: block; } /* +Refine ---------------------------------------------------------------------------------------- */ #PgJqueryDialog-Create-Alert[style] { height: auto !important; } #PgJqueryDialog-Save-Search[style] { height: auto !important; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .land-and-sites-search-tab .additional-options-open .search-buttons-container { top: 244px; } .land-and-sites-search-tab .additional-options-open #refine { top: 279px; } } .refine-section { border-top: 1px solid #d6d6d6; padding: 15px; } .refine-section#keyword-refine { -webkit-box-shadow: none; box-shadow: none; border-top: none; } .refine-section h3:first-child { font-size: 1em; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .refine-section h3:first-child { border-bottom: 1px solid #333; padding-bottom: 5px; } } .refine-section ul, .refine-section .add-more { margin: 0; clear: both; } .refine-section ul.long-list { padding-bottom: 15px; } .refine-section .count { color: #A3A3A3; } .refine-section label { padding-left: 5px; } #refine { padding: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #refine #area-picker-close-button { display: none; } } #refine #close-refine { display: none; } #refine .module-title { margin-bottom: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #refine { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; z-index: 9998; position: absolute; top: 213px; display: none; left: 15px; right: 15px; border-radius: 0; height: 440px; max-height: 440px; } #refine li { padding: 5px; color: #A3A3A3; } #refine li:hover { cursor: pointer; background: #e5edf3; } #refine li:first-child { border-top: none; } #refine .selected { background: #e2f1fe; font-weight: bold; color: #333; } #refine .module-title, #refine #desktop-refines, #refine #area-picker-close-button { display: none; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #refine { top: 231px; } } #refine .selected-item { margin-bottom: 5px; } #refine li.selected-item:first-child { border: 1px solid #c2d5e3; } #refine #refine-area-picker { -webkit-tap-highlight-color: transparent; } #refine #refine-area-picker .quick-search-popup-container { height: 370px; max-height: 370px; right: 227px; margin-top: -50px; } #refine #refine-area-picker .quick-search-popup-container .loading-spinner { position: absolute; top: 7.5px; right: 7.5px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #refine #refine-area-picker .quick-search-popup-container { display: block; height: 310px; border-radius: 0; position: relative; border: 0; -webkit-box-shadow: none; box-shadow: none; padding: 0; margin-top: -15px; right: auto; } #refine #refine-area-picker .quick-search-popup-container .area-picker { display: none; width: 80% !important; margin-top: 15px; -webkit-box-sizing: border-box; box-sizing: border-box; } #refine #refine-area-picker .quick-search-popup-container .area-picker ul { height: 243px; } #refine #refine-area-picker .quick-search-popup-container .area-picker li { padding: 0; } #refine #refine-area-picker .quick-search-popup-container .area-picker li:hover { background: transparent; } #refine #refine-area-picker .quick-search-popup-container .add-area-done { display: none; } #refine #refine-area-picker .quick-search-popup-container .bordered-heading, #refine #refine-area-picker .quick-search-popup-container #services .Blog h3, #services .Blog #refine #refine-area-picker .quick-search-popup-container h3, #refine #refine-area-picker .quick-search-popup-container #services .Advice h3, #services .Advice #refine #refine-area-picker .quick-search-popup-container h3 { display: none; } #refine #refine-area-picker .quick-search-popup-container .search-box-text[style] { width: 100% !important; margin-bottom: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } } #refine #refine-area-picker .quick-search-popup-container .area-picker { width: 93%; height: 243px; } #refine #refine-area-picker .quick-search-popup-container .area-picker li { font-size: 12px; } .quick-search-popup-container { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; padding: 18px; border-radius: 5px 5px 5px 5px; right: 157px; display: none; } .quick-search-popup-container li { padding: 5px; color: #A3A3A3; } .quick-search-popup-container li:hover { cursor: pointer; background: #e5edf3; } .quick-search-popup-container li:first-child { border-top: none; } .quick-search-popup-container .selected { background: #e2f1fe; font-weight: bold; color: #333; } .quick-search-popup-container .search-list { top: 96px; width: 436px; } .quick-search-popup-container .search-text-box-outer { margin-bottom: 15px; } .quick-search-popup-container .add-area-done { position: absolute; bottom: 15px; right: 15px; } .quick-search-popup-container .add-area-done:before { content: '\2713'; font-family: 'ssstandard-web'; color: green; padding-right: 7.5px; font-size: 14px; line-height: 2em; } #price-range-refine { position: relative; } #price-range-refine label { color: #333; text-decoration: none; } #rooms-refine ul, #reception-refine ul { width: 48.8%; float: left; clear: none; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #rss { display: none; } .span-3.last #advert { display: none; } } #refine-content #tablet-refine-tabs, #refine-content #tablet-refine-actions { display: none; } #refine-content #keyword-refine input.button, #refine-content #keyword-refine input.module--placeholder_button, #refine-content #keyword-refine input.area-picker-button, #refine-content #keyword-refine input.price-range-drop-down-arrow { background: transparent; padding-left: 0; } #refine-content #vertical-tabs-container { background: transparent; } #refine-content #vertical-tabs-container .panel { min-height: inherit; padding: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #refine-content #vertical-tabs-container .panel { padding: 15px 15px 15px 185px; } #refine-content #vertical-tabs-container .panel#other { border-bottom: 0 !important; } } #refine-content #vertical-tabs-container .panel#other { border-radius: 0 0 5px 5px; border-bottom: 10px solid #D23722; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #refine-content { display: block; position: relative; } #refine-content #tablet-refine-tabs, #refine-content #tablet-refine-actions { display: block; } #refine-content #price-range-refine input.price-range-value { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } #refine-content #price-range-refine .range-drop-down { z-index: 8000; width: 80%; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; } #refine-content #vertical-tabs-container { height: 440px; } #refine-content .refine-section { padding: 0; border: none; margin-bottom: 15px; } #refine-content .panel { height: 349px; overflow-x: scroll; } #refine-content .search-text-box-outer { margin: 0; } #refine-content .search-list { width: 80%; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; top: 0; } #refine-content #tablet-refine-tabs { width: 160px; } #refine-content #tablet-refine-tabs li { padding: 15px; } #refine-content #tablet-refine-tabs .selected { background: #075ca7; } #refine-content #tablet-refine-tabs .selected a, #refine-content #tablet-refine-tabs .selected .refine-section label, .refine-section #refine-content #tablet-refine-tabs .selected label { color: white; } #refine-content #tablet-refine-actions { position: absolute; border-top: 1px solid #d6d6d6; background: white; bottom: 0; left: 0; right: 0; padding: 12px; text-align: right; } #refine-content .search-selections { font-size: 12px; } #refine-content .selected-item { padding: 0; } #refine-content .price-range-value { width: 95%; } #refine-content #keyword-refine input[type="image"][style] { display: none !important; } #refine-content #type-refine-options > li.more, #refine-content #type-toggle, #refine-content #heating-refine-options > li.more-heating-types, #refine-content #heating-type-toggle { display: none; } #refine-content ul.long-list > li { width: 210px; float: left; display: inline-block; } } /*------------------------------------* RESULTS /*------------------------------------*/ #search-results { position: relative; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #search-results { width: 100%; float: none; } } #search-results .grid .pager.bottom { background: transparent; padding: 15px 0; border-top: 1px solid #d6d6d6; margin-top: 15px; } .options-tag { position: absolute; left: 260px; top: 5px; } .options-tag .ss-icon, .options-tag .ui-dialog-titlebar-close, .options-tag .close-icon, .options-tag .module__close, .options-tag .area-picker li:after, .area-picker .options-tag li:after, .options-tag .recent-searches li:after, .recent-searches .options-tag li:after, .options-tag .recent-searches li:before, .recent-searches .options-tag li:before { font-size: 1em; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .options-tag { display: none; } } #search-tab-container { line-height: 45px; border-bottom: 1px solid #d6d6d6; } #view { font-size: 1.4em; } #view .tabbed-list--plain { margin-left: -15px; } #view .view-tab a, #view .view-tab .refine-section label, .refine-section #view .view-tab label { color: #A3A3A3; } #view .current, #view li:hover { background: white; } #view .current a, #view .current .refine-section label, .refine-section #view .current label, #view li:hover a, #view li:hover .refine-section label, .refine-section #view li:hover label { color: #D23722; } #view li:hover a, #view li:hover .refine-section label, .refine-section #view li:hover label { color: #333; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #view { font-size: 1.2em; } } .search-details { padding: 15px 0; } .search-details .property-count { margin-right: 15px; } .search-details__count { width: 55%; margin: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-details__count { width: 50%; } } .search-details__pager { text-align: right; width: 45%; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-details__pager { width: 50%; } } .search-details__pager > * { display: inline; margin: 0 0 0 7.5px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .search-details__pager p { display: none; } } .search-options { line-height: 2.4em; } .count-stats .search-count { display: inline; font-size: 1.2em; } .page-count { line-height: 30px; } .sort-options strong, .sort-options span, .sort-options a, .sort-options .refine-section label, .refine-section .sort-options label { margin-right: 3px; border-left: 1px solid #d6d6d6; padding-left: 5px; } .sort-options strong { padding-left: 0; border-left: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .sort-options { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; z-index: 9998; width: 160px; top: 27px; display: none; left: 54%; height: 200px; } .sort-options li { padding: 5px; color: #A3A3A3; } .sort-options li:hover { cursor: pointer; background: #e5edf3; } .sort-options li:first-child { border-top: none; } .sort-options .selected { background: #e2f1fe; font-weight: bold; color: #333; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) and (min-width: 30.0625em) and (max-width: 48em) { .sort-options { left: 370px; top: 31px; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .sort-options strong, .sort-options a, .sort-options .refine-section label, .refine-section .sort-options label, .sort-options .selected { display: block; border-bottom: 1px solid #d6d6d6; padding: 15px; } .sort-options p { margin: 0; color: white; text-align: left; } .sort-options p strong { display: none; } } .search-instead { background: white; } #map-container.module, #map-container.member--count { border-radius: 0px 5px 5px 5px; min-height: 620px; } #map-container.module.results-container, #map-container.results-container.member--count { margin-top: 15px; } #map, .marker-overlay { height: 600px; clear: both; width: 100%; } #show-on-map { position: absolute; top: 40px; right: 0; background: rgba(255, 255, 255, 0.8); padding: 15px; text-align: left; } #show-on-map ul li img { margin-right: 4px; } #toggle-key-heading { font-size: 1.2em; } .loader { width: 100px; height: 100px; background: url("/images/pn-loader-red.gif"); position: absolute; right: 50%; margin-right: -50px; opacity: 0.8; z-index: 2; top: 100px; } #map-info { background: white; border-radius: 5px 5px 5px 5px; text-align: left; -webkit-box-shadow: 1px 2px 5px #888; box-shadow: 1px 2px 5px #888; padding: 10px; width: 300px; } #map-info .close-map-popup { position: absolute; right: -13px; top: -13px; } #map-info .arrow { width: 0; height: 0; border-bottom: 20px solid transparent; border-top: 20px solid transparent; border-right: 20px solid white; position: absolute; left: -20px; top: 30px; } #map-info .ui-accordion-header { background: #D23722; color: white; margin-bottom: 7.5px; font-size: 12px; padding: 7.5px; } #map-info .ui-accordion-header:hover { background: #bc311e; cursor: pointer; } #map-info .map-info-body img { float: left; margin-right: 7.5px; } #map-info .map-info-body .details span { display: block; } #map-info .map-info-body .details span.status { font-weight: bold; color: #D23722; } #map-info .price { font-weight: bold; } #map-info .propOptions li { display: inline-block; margin-right: 7.5px; } #close-streetview-icon:hover { cursor: pointer; } #tablet-refine-button { display: none; background: white; border: 0; font-weight: bold; color: #333; bottom: -62px; right: 200px; position: absolute; z-index: 1; -webkit-box-shadow: 1px 1px 5px #c4b8a0; box-shadow: 1px 1px 5px #c4b8a0; } #tablet-refine-button .ss-icon, #tablet-refine-button .ui-dialog-titlebar-close, #tablet-refine-button .close-icon, #tablet-refine-button .module__close, #tablet-refine-button .area-picker li:after, .area-picker #tablet-refine-button li:after, #tablet-refine-button .recent-searches li:after, .recent-searches #tablet-refine-button li:after, #tablet-refine-button .recent-searches li:before, .recent-searches #tablet-refine-button li:before { font-size: 0.5em; padding-left: 6px; } #tablet-refine-button.selected { border: 1px solid #b0b0b0; border-radius: 3px 3px 0 0; height: 23px; -webkit-box-shadow: none; box-shadow: none; border-bottom: 0; z-index: 9999; border-radius: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .results-listings #tablet-refine-button { display: block; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .inc-featured #tablet-refine-button { bottom: -242px !important; } .inc-featured #refine { top: 392px; } .inc-featured .additional-options-open #refine { top: 456px; } } .saved .favourite-icon { color: #edca07; display: inline-block; } .results-seo { background: white; } .results-seo:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .results-seo li { float: left; width: 100%; margin-right: 2.4%; width: 40.2666666667%; } #results-leaderboard-bottom { text-align: center; margin-bottom: 15px; padding: 15px; display: block; } #results-leaderboard-middle { text-align: center; background-color: white; border-top: 1px solid #d6d6d6; padding: 15px; margin: 0; display: block; } /* -------- Featured Properties ------------ */ .featured-property-wrapper { width: 31.7333333333%; -webkit-box-shadow: 0px 1px 3px #cecece; box-shadow: 0px 1px 3px #cecece; float: left; background: white; border-radius: 5px; margin-bottom: 15px; margin-left: 2.4%; padding: 0; } .featured-property-wrapper:first-child { margin: 0; } .featured-property, .featured-agent { margin: 5px; height: 156px; background: #cecece; display: block; position: relative; text-align: center; vertical-align: middle; overflow: hidden; } .featured-property ul.slideshow, .featured-agent ul.slideshow { margin: 0; } .featured-property ul.slideshow li, .featured-agent ul.slideshow li { display: block; height: 156px; padding-bottom: 10px; text-align: center; } .featured-property ul.slideshow img, .featured-agent ul.slideshow img { vertical-align: middle; max-height: 100%; max-width: 100%; } .featured-property ul.slideshow #prev-photo, .featured-property ul.slideshow #next-photo, .featured-agent ul.slideshow #prev-photo, .featured-agent ul.slideshow #next-photo { margin: auto 0; width: 7.5px; height: 20px; padding: 14px; background: #333333; background: rgba(0, 0, 0, 0.4); } .featured-property ul.slideshow #prev-photo span, .featured-property ul.slideshow #next-photo span, .featured-agent ul.slideshow #prev-photo span, .featured-agent ul.slideshow #next-photo span { display: none; } .featured-property ul.slideshow #prev-photo:hover, .featured-property ul.slideshow #next-photo:hover, .featured-agent ul.slideshow #prev-photo:hover, .featured-agent ul.slideshow #next-photo:hover { background: #333333; background: rgba(0, 0, 0, 0.6); } .featured-property ul.slideshow #next-photo, .featured-agent ul.slideshow #next-photo { right: 3px; padding-left: 4px; padding-right: 8px; } .featured-property ul.slideshow #prev-photo, .featured-agent ul.slideshow #prev-photo { left: 3px; padding-right: 4px; padding-left: 8px; } .featured-property ul.slideshow #next-photo:before, .featured-property ul.slideshow #prev-photo:before, .featured-agent ul.slideshow #next-photo:before, .featured-agent ul.slideshow #prev-photo:before { margin-top: 0; position: relative; } .featured-property ul.slideshow #next-photo:before, .featured-agent ul.slideshow #next-photo:before { left: 1px; } .featured-property ul.slideshow #prev-photo:before, .featured-agent ul.slideshow #prev-photo:before { left: -1px; } .featured-property .info-container, .featured-agent .info-container { background-color: #333333; background-color: rgba(0, 0, 0, 0.7); color: white; position: absolute; bottom: 0px; width: 100%; height: 54px; text-align: left; } .featured-property .info-container .inner, .featured-agent .info-container .inner { padding: 5px; } .featured-property .info-container .text, .featured-agent .info-container .text { float: left; font-size: 11px; width: 72%; } .featured-property .info-container .text a, .featured-property .info-container .text .refine-section label, .refine-section .featured-property .info-container .text label, .featured-agent .info-container .text a, .featured-agent .info-container .text .refine-section label, .refine-section .featured-agent .info-container .text label { color: white; } .featured-property .info-container .text a:hover, .featured-property .info-container .text .refine-section label:hover, .refine-section .featured-property .info-container .text label:hover, .featured-agent .info-container .text a:hover, .featured-agent .info-container .text .refine-section label:hover, .refine-section .featured-agent .info-container .text label:hover { text-decoration: none; } .featured-property .info-container .text p, .featured-agent .info-container .text p { line-height: 15px; margin-bottom: 0; } .featured-property .info-container .text p.time-ago, .featured-agent .info-container .text p.time-ago { font-size: 10px; color: #9A9A9A; } .featured-property .info-container .text .address, .featured-agent .info-container .text .address { font-weight: bold; height: 14px; overflow: hidden; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .featured-property .info-container .text, .featured-agent .info-container .text { width: 65.8666666667%; } } .featured-property .info-container .agent-logos, .featured-agent .info-container .agent-logos { float: right; } .featured-property .info-container .agent-logos img, .featured-agent .info-container .agent-logos img { max-height: 82%; max-width: 44px; } .featured-property .info-container .agent-logos p.agent-logo, .featured-agent .info-container .agent-logos p.agent-logo { display: none; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .featured-property .info-container .agent-logos, .featured-agent .info-container .agent-logos { width: 14.6666666667%; margin-right: 5px; } .featured-property .info-container .agent-logos img, .featured-agent .info-container .agent-logos img { width: 100%; } } .featured-property .info-container .agent-logos-dual img, .featured-agent .info-container .agent-logos-dual img { max-height: 82%; max-width: 25px; } .featured-property .info-container .agent-logo-second, .featured-agent .info-container .agent-logo-second { position: absolute; right: 35px; } .featured-agent { background: white; } .featured-agent .tag { background: #D23722; } .featured-agent a, .featured-agent .refine-section label, .refine-section .featured-agent label { text-decoration: none; } .featured-agent .logo-area { width: 100%; height: 156px; line-height: 156px; text-align: center; } .featured-agent .logo-area .featured-agent-logo { max-width: 100%; max-height: 156px; vertical-align: middle; } .featured-agent .info-container { height: 32px; display: none; } .featured-agent .text { width: 100%; } .featured-promo-double, .featured-promo-single { color: #B5AFA4; text-align: center; margin-bottom: 15px; float: left; margin-left: 4px; } .featured-promo-double .inner, .featured-promo-single .inner { border-radius: 5px; border: 2px dashed #DAD4CA; padding: 12px; height: 138px; } .featured-promo-double h3, .featured-promo-single h3 { font-size: 20px; } .featured-promo-double h3 span.ss-icon, .featured-promo-double h3 span.ui-dialog-titlebar-close, .featured-promo-double h3 span.close-icon, .featured-promo-double h3 span.module__close, .featured-promo-single h3 span.ss-icon, .featured-promo-single h3 span.ui-dialog-titlebar-close, .featured-promo-single h3 span.close-icon, .featured-promo-single h3 span.module__close { margin-right: 0; font-size: 46px; } .featured-promo-double p, .featured-promo-single p { font-size: 16px; } /* Feature your property promo spots */ .featured-promo-double { width: 65.8666666667%; margin-left: 2.4%; } .featured-promo-single { width: 31.7333333333%; margin-left: 2.4%; } .featured-promo-single .inner { padding: 12px 10px; } .featured-promo-single h3 { font-size: 16px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .featured-promo-single h3 { font-size: 15px; } } .featured-promo-single p { font-size: 12px; } #map-info.promo { background: #fdecce; } #map-info.promo .ui-accordion-header { background: #F8BB4E; } #map-info.promo .arrow { border-right: 20px solid #fdecce; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .span-3.side-panel { width: 100%; } } .result__details > .added { display: none; } /* +Search Area ------------------------------------------------------------------------------------- */ .search-area { background: #D23722; border-radius: 0 5px 5px 5px; padding: 0; position: relative; } .search-area:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .search-area #quick-search, .search-area #quick-search-form { position: relative; } .search-area .main-title { font-size: 24px; margin-bottom: 13px; } .search-area .main-title .underline { font-weight: bold; } .search-area .main-title .highlight { display: none; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .search-area .main-title { display: block; font-size: 1.4em; margin-bottom: 8px; } } .search-area label, .search-area h1, .search-area h3, .search-area #info-line { color: white; font-weight: bold; } @media only screen and (max-width: 48em) { .search-area label.search-supporting-line, .search-area h1.search-supporting-line, .search-area h3.search-supporting-line, .search-area #info-line.search-supporting-line { display: none; } } .search-area label { font-size: 11px; } .search-area select { border: 1px solid #d6d6d6; height: 30px; font-size: 14px; margin-left: 0; } .search-area .radio-group { margin-bottom: 15px; } .search-area .radio-group:after { content: ""; display: block; clear: both; visibility: hidden; height: 0px; } .search-area .radio-group label { font-size: 1.4em; font-weight: bold; float: left; } .search-area .radio-group input[type="radio"] { float: left; margin-right: 7.5px; } .search-area .radio-item { float: left; margin-right: 30px; } .search-area .search-text-box-outer, .search-area #no-script #search-box-text { width: 78%; float: left; margin-right: 3%; } .search-area .search-text-box-outer-inner { width: 9999px; } .search-area .search-button, .search-area #no-script #search-button { width: 18%; float: left; } .search-area .search-button input[type="submit"], .search-area .search-button input[type="button"], .search-area #no-script #search-button input[type="submit"], .search-area #no-script #search-button input[type="button"] { width: 100%; font-size: 18px; height: 43px; } .search-area #no-script #search-box-text { width: 75%; font-size: 18px; padding: 8px; } .search-area #no-script #search-button input[type="button"] { background: #ccc; border-color: #ccc; color: #4d4c4c; width: 100%; font-size: 18px; height: 43px; } .search-area #no-script #search-button input[type="button"]:visited { color: #4d4c4c; } .search-area #no-script #search-button input[type="button"]:hover { background: #bfbfbf; color: #333333; } .search-area #no-script #search-button input[type="button"]:active { background: #b3b2b2; color: #1a1919; } .search-area #no-script #search-button input[type="button"][disabled] { background: #ccc; } .search-area #no-script #search-button input[type="button"][disabled]:hover, .search-area #no-script #search-button input[type="button"][disabled]:active { background: #ccc; } .search-area .advanced-search-link { position: absolute; right: 0; bottom: 15px; margin: 7.5px; } .search-area .search-selections { margin: 0; } .search-area.search-again { position: inherit; padding: 15px; min-height: 44px; } .search-area.search-again h3 { padding: 7.5px 15px 0 0; float: left; width: 100%; margin-right: 2.4%; width: 14.6666666667%; margin: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-area.search-again h3 { display: none; } } .search-area.search-again #quick-search-autocomplete { float: left; width: 100%; margin-right: 2.4%; z-index: 2; margin-right: 0; width: 65.8666666667%; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-area.search-again #quick-search-autocomplete { width: 87%; margin-bottom: 0; } } .search-area.search-again .advanced-search-link { right: 0; top: 3.75px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-area.search-again .advanced-search-link { top: 0; width: 70px; text-align: right; } } .search-area.search-again .additional-options { display: none; } .search-area.search-again .additional-options { border-top: 1px solid #e15846; margin-top: 10px; padding-top: 10px; } .search-area.search-again .additional-options .input-group { float: left; margin-right: 15px; } .search-area.search-again .additional-options .input-group { line-height: 30px; white-space: nowrap; } .search-area.search-again .additional-options .input-group input[type="checkbox"] { margin-left: 0; } .search-area.search-again .additional-options label { margin: 0 7.5px 0 0; display: inline-block; float: none; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-area.search-again .additional-options { margin-right: 0; margin-top: 5px; padding-top: 7.5px; } } .search-area.search-again #price-range { line-height: 1.6em; display: inline-block; } .search-area .search-text-box-outer { background: white; position: relative; overflow: hidden; border: 1px solid #d6d6d6; height: 41px; } .search-area .search-text-box-outer .search-box-text { border: 0; -webkit-appearance: none; font-size: 15.6px; outline: none; padding: 8px; display: inline; height: 25px; } .search-area .search-text-box-outer .loading-spinner { position: absolute; top: 9px; right: 37px; } .search-area .price-range-value { width: 220px; } .search-area #quick-search-autocomplete, .search-area #agents-search-autocomplete { position: relative; -webkit-tap-highlight-color: transparent; } .search-area #agents-search-autocomplete .recent-searches-link { display: none; } .search-area #agents-search-autocomplete .search-button input { min-height: 38px !important; } .search-area .additional-options .input-group { float: left; margin-right: 30px; } .search-area .additional-options .input-group input[type="checkbox"] { margin-left: 48px; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .search-area .additional-options .input-group#exclude-agreed input[type="checkbox"] { margin-left: 0; } } .search-area .additional-options .last { margin-right: 0; } .search-area .additional-options label { display: block; margin: 7.5px 0 7.5px 0; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .search-area .additional-options label { margin-bottom: 0; } } .search-area .additional-options input[type="checkbox"] { margin-top: 7.5px; } .search-area .selected-item { margin: 5.5555555556px; } .search-area #PropertyType-2 { width: 195px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-area #PropertyType-2 { width: 150px; } .search-area .advanced-search-link { right: 36px; margin: 0; } .search-area .search-text-box-outer { height: 41px; } .search-area .search-text-box-outer .search-box-text { font-size: 14px; padding: 9.375px; } .search-area .search-text-box-outer .loading-spinner { right: 57px; top: 10px; } } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .search-area .additional-options { margin-right: 15.5%; } .search-area .additional-options label { margin-right: 12px; font-size: 12px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .search-area .advanced-search-link { right: 24px; } .search-area .additional-options { margin-right: 0; } } #all-search .main-title { margin-bottom: 15px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #all-search .main-title { display: none; } } #for-rent-search .main-title, #new-homes-search .main-title, #for-sale-search .main-title { margin-bottom: 22px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #for-rent-search .main-title, #new-homes-search .main-title, #for-sale-search .main-title { margin-bottom: 12px; } } #new-homes-search .main-title { font-size: 23px; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #new-homes-search .main-title { font-size: 1.4em; } } #auction-search .advanced-search-link { display: none; } #all-search #info-line, #commercial-search #info-line, #land-and-sites-search #info-line { position: absolute; top: 68px; right: 7.5px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #all-search #info-line, #commercial-search #info-line, #land-and-sites-search #info-line { display: none; } } #land-and-sites-search .advanced-search-link { bottom: 126px; } #land-and-sites-search #info-line { display: none; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #land-and-sites-search .additional-options .input-group#exclude-agreed input[type="checkbox"] { margin-left: 10px; } #land-and-sites-search .advanced-search-link { bottom: 15px; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #commercial-search.search-again .radio-group { margin-bottom: 0; float: left; margin-right: 25px; } #commercial-search.search-again .radio-item { margin-right: 0; margin-top: 7px; } #commercial-search.search-again .radio-item label { font-weight: bold; font-size: 12px; margin-top: 3px; } #commercial-search .additional-options .input-group { display: inline-block; } #commercial-search .additional-options label { display: inline-block; margin-right: 15px; } #commercial-search #price-range { display: inline-block; } #commercial-search #price-range span label { margin-right: 0; } #commercial-search #exclude-agreed input[type="checkbox"] { margin-left: 0; } } #info-line { margin-bottom: 7.5px; } .search-area { min-height: 227px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-area { min-height: inherit; } } .quick-search-form.span-8 { float: none; margin-right: 318px; position: relative; border-radius: 5px 5px 5px 5px; } .quick-search-form.span-8 #quick-search { padding: 22.5px 0 22.5px 22.5px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .quick-search-form.span-8 { width: 100%; } .quick-search-form.span-8 #quick-search { padding: 15px; } } #promo-area { position: absolute; top: 0; bottom: 0; right: 0; border-radius: 0 5px 5px 0; } #promo-area .inner { display: block; height: 227px; border-radius: 0 5px 5px 0; } #promo-area .inner div { width: 318px; height: 227px; background-repeat: no-repeat; border-radius: 0 5px 5px 0; overflow: hidden; } #promo-area .info { background-color: rgba(0, 0, 0, 0.7); position: absolute; bottom: 0; width: 288px; left: 0; font-size: 0.9em; font-weight: bold; color: white; margin: 0; padding: 7.5px 15px; text-align: right; border-radius: 0 0 5px 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #promo-area { display: none; } } #for-sale-search.search-area #promo-area .inner.first-slide .info, #for-rent-search.search-area #promo-area .inner.first-slide .info, #new-homes-search.search-area #promo-area .inner.first-slide .info, #commercial-search.search-area #promo-area .inner.first-slide .info, #land-and-sites-search.search-area #promo-area .inner.first-slide .info, #auction-search.search-area #promo-area .inner.first-slide .info { display: none; } .area-picker, .recent-searches { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; width: 78%; z-index: 1000; height: 240px; display: none; top: 42px; } .area-picker li, .recent-searches li { padding: 5px; color: #A3A3A3; } .area-picker li:hover, .recent-searches li:hover { cursor: pointer; background: #e5edf3; } .area-picker li:first-child, .recent-searches li:first-child { border-top: none; } .area-picker .selected, .recent-searches .selected { background: #e2f1fe; font-weight: bold; color: #333; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .area-picker, .recent-searches { height: 316px; } } .area-picker ul, .recent-searches ul { overflow-y: auto; height: 240px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .area-picker ul, .recent-searches ul { height: 319px; } } .area-picker .bordered-list li, .area-picker .range-drop-down ul li, .range-drop-down .area-picker ul li, .area-picker .search-list li, .recent-searches .bordered-list li, .recent-searches .range-drop-down ul li, .range-drop-down .recent-searches ul li, .recent-searches .search-list li { padding: 0; } .area-picker li, .recent-searches li { color: #333; position: relative; } .area-picker li a, .area-picker li .refine-section label, .refine-section .area-picker li label, .recent-searches li a, .recent-searches li .refine-section label, .refine-section .recent-searches li label { display: block; padding: 5px; text-decoration: none; color: #333; -webkit-tap-highlight-color: #e5edf3; } .area-picker li a:active, .area-picker li .refine-section label:active, .refine-section .area-picker li label:active, .recent-searches li a:active, .recent-searches li .refine-section label:active, .refine-section .recent-searches li label:active { background: #e5edf3; } .area-picker li:after, .recent-searches li:after { content: '▹'; position: absolute; right: 5px; top: 5px; } .area-picker li.last-item:after, .recent-searches li.last-item:after { content: ""; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .area-picker li:after, .recent-searches li:after { top: 11px; } .area-picker li:hover, .recent-searches li:hover { background: transparent; } .area-picker li a, .area-picker li .refine-section label, .refine-section .area-picker li label, .recent-searches li a, .recent-searches li .refine-section label, .refine-section .recent-searches li label { font-size: 16px; padding: 10px; } } .area-picker .picker-option-list, .recent-searches .picker-option-list { border-left: 1px solid #d6d6d6; vertical-align: top; } .area-picker .picker-option-list:first-child, .recent-searches .picker-option-list:first-child { border-left: none; } .area-picker-button { position: absolute; top: 0; padding: 0 7.5px; z-index: 999; border: none; text-align: center; right: 139px; line-height: 42px; } .area-picker-button .ss-icon, .area-picker-button .ui-dialog-titlebar-close, .area-picker-button .close-icon, .area-picker-button .module__close, .area-picker-button .area-picker li:after, .area-picker .area-picker-button li:after, .area-picker-button .recent-searches li:after, .recent-searches .area-picker-button li:after, .area-picker-button .recent-searches li:before, .recent-searches .area-picker-button li:before { margin-right: 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .area-picker-button { right: 21.9%; width: 30px; } } #area-picker-close-button { display: none; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #area-picker-close-button.visible { display: block; width: 29px; height: 28px; position: absolute; background: white; margin-top: -43px; border: 1px solid grey; border-bottom: 1px solid white; padding: 7.5px; left: 520px; z-index: 9999; text-align: center; text-decoration: none; } #area-picker-close-button.visible .ss-icon, #area-picker-close-button.visible .ui-dialog-titlebar-close, #area-picker-close-button.visible .close-icon, #area-picker-close-button.visible .module__close, #area-picker-close-button.visible .area-picker li:after, .area-picker #area-picker-close-button.visible li:after, #area-picker-close-button.visible .recent-searches li:after, .recent-searches #area-picker-close-button.visible li:after, #area-picker-close-button.visible .recent-searches li:before, .recent-searches #area-picker-close-button.visible li:before { color: #D23722; font-size: 22px; } } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { #area-picker-close-button.visible { left: 715px; } } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-again #area-picker-close-button.visible { left: 407px; } } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .search-again #area-picker-close-button.visible { left: 563px; } } .recent-searches { overflow: inherit; } .recent-searches li:after { display: none; } .recent-searches li:before { content: '🔎'; font-size: 14px; position: relative; float: left; margin-right: 22.5px; color: #d6d6d6; left: 8.3333333333px; top: 10px; height: 34px; } .recent-searches li:first-child { border: none; } .recent-searches li a, .recent-searches li .refine-section label, .refine-section .recent-searches li label { padding: 8px; } .recent-searches .searches { overflow: hidden; overflow-y: scroll; height: 240px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .recent-searches .searches { height: 279px; } } #price-range { position: relative; z-index: 1; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #price-range { display: inline-block; } #price-range span label { margin-right: 0; font-weight: normal; display: inline-block; } } .price-range-drop-down-arrow { position: absolute; top: 0; padding: 0 7.5px; z-index: 999; border: none; text-align: center; right: 0; height: 15px; } .range-drop-down { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; border-radius: 5px 5px 5px 5px; width: 120%; overflow: visible; margin-top: 7.5px; } .range-drop-down li { padding: 5px; color: #A3A3A3; } .range-drop-down li:hover { cursor: pointer; background: #e5edf3; } .range-drop-down li:first-child { border-top: none; } .range-drop-down .selected { background: #e2f1fe; font-weight: bold; color: #333; } .range-drop-down .range-content { padding: 15px; } .range-drop-down .range-close { background: #807f7f; border-radius: 20px 20px 20px 20px; color: white; font-size: 1em; padding: 0; width: 25.5px; height: 25.5px; border: 3px solid white; top: -10px; right: -10px; position: absolute; text-align: center; line-height: 2.3em; -webkit-box-shadow: 1px 1px 3px #333; box-shadow: 1px 1px 3px #333; } .range-drop-down .range-close:after { content: '\2421'; font-family: "SSStandard-web"; } .range-drop-down .range-close:hover { cursor: pointer; background: #666666; } .range-drop-down .heading-type { font-weight: bold; display: block; padding: 7.5px; color: white; font-size: 1.2em; background: #075ca7; } .range-drop-down .min-container { float: left; width: 49%; margin-right: 2%; } .range-drop-down .max-container { float: left; width: 49%; } .range-drop-down .list-container { overflow-y: scroll; height: 199px; border: 1px solid #d6d6d6; } .range-drop-down .done { clear: both; line-height: 30px; text-align: center; } .range-drop-down .done .icon:after { content: '\2713'; color: green; font-family: "SSStandard-web"; font-size: 1.2em; padding-right: 7.5px; } .search-list { background: white; border: 1px solid #b0b0b0; position: absolute; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); max-height: 279px; overflow: hidden; z-index: 7000; overflow-y: scroll; z-index: 1000; width: 499px; font-size: 13px; } .search-list li { padding: 5px; color: #A3A3A3; } .search-list li:hover { cursor: pointer; background: #e5edf3; } .search-list li:first-child { border-top: none; } .search-list .selected { background: #e2f1fe; font-weight: bold; color: #333; } .search-list .selected, .search-list li:hover { font-weight: normal; } .search-list .highlight { font-weight: bold; color: #333; } .search-list .Title, .search-list .Title:hover { cursor: auto; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .search-list { width: 78%; font-size: 15px; } .search-list li { padding: 10px; } } .search-list .property-item { overflow: hidden; } .search-list .property-item .img { float: left; width: 50px; height: 40px; overflow: hidden; padding-right: 15px; } .search-list .property-item .img img { width: 50px; height: auto; } .search-list .property-item .prop-details { float: left; width: 60%; } .search-list .property-item .agent-logos img { width: 22%; max-width: 45px; float: right; position: relative; } .selected-item { background: #e5edf3; border: 1px solid #c2d5e3; position: relative; font-weight: bold; float: left; margin-right: 3.75px; border-radius: 2.5px 2.5px 2.5px 2.5px; } .selected-item .label { color: #2771c4; padding: 3.75px 18.75px 3.75px 5px; display: block; } .selected-item .close { width: 15px; position: absolute; right: 0; top: 0; bottom: 0; border-left: 1px solid #c2d5e3; text-decoration: none; line-height: 24px; } .selected-item .close:hover { background: #c2d5e3; color: #D23722; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .selected-item .label { font-size: 1.2em; padding: 5px 37.5px 5.5555555556px 5px; } .selected-item .close { font-size: 1.2em; width: 30px; line-height: 31px; } } .component-MiniSearch #nav { width: 100%; } #price-range-refine input.price-range-value { width: 160px; } #directory-search.search-area { min-height: 0; } #agents-search-autocomplete .search-text-box-outer { height: 36px; } #agents-search-autocomplete .search-text-box-outer input { font-size: 16px; } #agents-search-autocomplete .search-text-box-outer-inner { width: auto; } #agents-search-autocomplete .search-button input { height: auto; font-size: 14px; } #agents-search-autocomplete .selected-item { margin: 3px; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { #agents-search-autocomplete .search-text-box-outer input { font-size: 16px; padding: 6px; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #agents-search-autocomplete .search-text-box-outer input { font-size: 16px; padding: 6px; } } .recent-searches-link { position: absolute; right: 175px; top: 14px; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .recent-searches-link { right: 29%; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .recent-searches-link { right: 31%; } } .searches li:first-child { border-top: none; } .side-panel-b { position: absolute; top: 0; bottom: 0; background: white; } .side-panel-b.right { right: 0; border-left: 1px solid #d6d6d6; } .side-panel-b.left { left: 0; } .side-panel.blue { background: #e5edf3; } /*------------------------------------* SITE OVERLAY Appears behind dialogs /*------------------------------------*/ .ui-widget-overlay { position: fixed; z-index: 999; left: 0; bottom: 0; top: 0; right: 0; background: rgba(0, 0, 0, 0.5); } /*------------------------------------* Slideshow /*------------------------------------*/ .fs-slideshow-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; } .fs-slideshow__header, .fs-slideshow__content, .fs-slideshow__footer { position: fixed; width: 100%; text-align: center; } .fs-slideshow__header { background: white; margin-bottom: 0; top: 0; } .fs-slideshow__content { top: 79px; } .large-slideshow-content-container { display: none; height: 96%; } .large-slideshow-content-container.current { display: block; } .large-slideshow-content-container .module, .large-slideshow-content-container .member--count { width: 666.666666667px; margin: 45px auto 0 auto; } .fs-slideshow__footer { bottom: 0; height: 128px; background: black; padding: 15px; } .fs-slideshow-overlay { position: fixed; z-index: 999; left: 0; bottom: 0; top: 0; right: 0; background: rgba(0, 0, 0, 0.9); } .fs-slideshow__property { width: 35%; float: left; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { .fs-slideshow__property .result__image { display: none; } } .fs-slideshow__nav { padding: 0; width: 65%; float: left; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 66px; } .fs-slideshow__nav li#large-slideshow-tab-streetview a:before, .fs-slideshow__nav li#large-slideshow-tab-streetview .refine-section label:before, .refine-section .fs-slideshow__nav li#large-slideshow-tab-streetview label:before { font-family: "SSStandard-web"; color: #333; font-size: 14px; content: "🏢"; display: block; } .fs-slideshow__nav li#large-slideshow-tab-streetview.current a, .fs-slideshow__nav li#large-slideshow-tab-streetview.current .refine-section label, .refine-section .fs-slideshow__nav li#large-slideshow-tab-streetview.current label { color: white; } .fs-slideshow__nav li#large-slideshow-tab-streetview.current a:before, .fs-slideshow__nav li#large-slideshow-tab-streetview.current .refine-section label:before, .refine-section .fs-slideshow__nav li#large-slideshow-tab-streetview.current label:before { color: white; } .fs-slideshow__nav li.close { width: 85px; } .fs-slideshow__nav .tabbed-list--slideshow { background: white; } .fs-slideshow__nav .tabbed-list--slideshow > li { border-left: 1px solid #d6d6d6; margin-right: 0; padding: 0; } .fs-slideshow__nav .tabbed-list--slideshow > li a, .fs-slideshow__nav .tabbed-list--slideshow > li .refine-section label, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li label { font-weight: bold; color: #333; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; padding: 20px 7.5px; text-decoration: none; } .fs-slideshow__nav .tabbed-list--slideshow > li a:hover, .fs-slideshow__nav .tabbed-list--slideshow > li .refine-section label:hover, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li label:hover { background: #e6e5e5; } .fs-slideshow__nav .tabbed-list--slideshow > li a .standard-icon, .fs-slideshow__nav .tabbed-list--slideshow > li .refine-section label .standard-icon, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li label .standard-icon { color: #333; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { .fs-slideshow__nav .tabbed-list--slideshow > li a, .fs-slideshow__nav .tabbed-list--slideshow > li .refine-section label, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li label { padding: 29px 7.5px 30px; } .fs-slideshow__nav .tabbed-list--slideshow > li a .fs-slideshow__nav-title, .fs-slideshow__nav .tabbed-list--slideshow > li .refine-section label .fs-slideshow__nav-title, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li label .fs-slideshow__nav-title, .fs-slideshow__nav .tabbed-list--slideshow > li a .title, .fs-slideshow__nav .tabbed-list--slideshow > li .refine-section label .title, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li label .title { display: none; } } .fs-slideshow__nav .tabbed-list--slideshow > li.current a, .fs-slideshow__nav .tabbed-list--slideshow > li.current .refine-section label, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li.current label { background: #333; color: white; } .fs-slideshow__nav .tabbed-list--slideshow > li.current a .standard-icon, .fs-slideshow__nav .tabbed-list--slideshow > li.current .refine-section label .standard-icon, .refine-section .fs-slideshow__nav .tabbed-list--slideshow > li.current label .standard-icon { color: white; } .fs-slideshow__nav .tabbed-list--slideshow.one-items { width: 100%; } .fs-slideshow__nav .tabbed-list--slideshow.two-items li { width: 50%; } .fs-slideshow__nav .tabbed-list--slideshow.three-items li { width: 33.3333333333%; } .fs-slideshow__nav .tabbed-list--slideshow.four-items li { width: 25%; } .fs-slideshow__nav .tabbed-list--slideshow.five-items li { width: 20%; } .fs-slideshow__nav .tabbed-list--slideshow.six-items li { width: 16.6666666667%; } .fs-slideshow__nav .tabbed-list--slideshow.seven-items li { width: 14.2857142857%; } .fs-slideshow__nav .tabbed-list--slideshow.eight-items li { width: 12.5%; } .close-slideshow { position: absolute; top: 0; right: 0; background: #D23722; padding: 30px 26px 29px 26px; } .close-slideshow span { color: white; margin-right: 0; } #prev-photo-large, #next-photo-large { position: absolute; top: 50%; bottom: auto; z-index: 1002; font-size: 26px; height: 190px; margin-top: -95px; width: 45px; line-height: 190px; background: rgba(0, 0, 0, 0.6); border-radius: 0; } .fs-photo-slides { display: table; width: 100%; height: 96%; } .fs-photo-slides__main-image-wrapper { display: table-cell; vertical-align: middle; text-align: center; } .fs-slideshow-main-image, #large-slideshow-main-image { height: 100%; max-width: 100%; } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .fs-slideshow-main-image, #large-slideshow-main-image { height: auto; max-height: 100%; } } h4.fs-slideshow-main-image { line-height: 400px; } #slideshow-thumb-slider { position: relative; } #slideshow-thumb-slider .right-hero-button, #slideshow-thumb-slider #next-photo, #slideshow-thumb-slider .left-hero-button, #slideshow-thumb-slider #prev-photo { width: 4%; border-radius: 0; background-color: rgba(0, 0, 0, 0.6); line-height: 141px; } #slideshow-thumb-slider .ss-icon, #slideshow-thumb-slider .ui-dialog-titlebar-close, #slideshow-thumb-slider .close-icon, #slideshow-thumb-slider .module__close, #slideshow-thumb-slider .area-picker li:after, .area-picker #slideshow-thumb-slider li:after, #slideshow-thumb-slider .recent-searches li:after, .recent-searches #slideshow-thumb-slider li:after, #slideshow-thumb-slider .recent-searches li:before, .recent-searches #slideshow-thumb-slider li:before { font-size: 2em; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { #large-slideshow-image-thumbs[style] { display: none !important; } #large-slideshow-image-thumbs { display: none !important; } } #brochure-slideshow { position: relative; } .nav-action { display: none; height: 100px; line-height: 100px; background: rgba(0, 0, 0, 0.5); padding: 15px 7.5px; font-size: 1.8em; top: 50%; margin-top: -50px; } .nav-action:hover { background: rgba(0, 0, 0, 0.5); } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { .nav-action { display: block; } .nav-action.right-hero-button:after, .nav-action#next-photo:after { content: "directright"; } .nav-action.left-hero-button:after, .nav-action#prev-photo:after { content: "directleft"; } } #thumb-slider-main { border: none; width: 100%; margin: 0; height: 100%; } #thumb-slider-main img { height: 126px; } #gpt-25 { height: 90px; overflow: hidden; } #slideshow-hideable-advert a, #slideshow-hideable-advert .refine-section label, .refine-section #slideshow-hideable-advert label { color: white; } @media only screen and (min-width: 48.0625em) and (max-width: 64em) { #slideshow-hideable-advert { display: none; } #slideshow-hideable-advert a, #slideshow-hideable-advert .refine-section label, .refine-section #slideshow-hideable-advert label { display: none; } } #large-slideshow-map { width: 100%; } #large-slideshow-map #map { width: auto; } #large-slideshow-epc .module, #large-slideshow-epc .member--count { text-align: left; } #large-slideshow-epc .module #large-slideshow-epc-image, #large-slideshow-epc .member--count #large-slideshow-epc-image { float: left; } #large-slideshow-epc .module .details, #large-slideshow-epc .member--count .details { float: right; background: #f8f7f5; padding: 15px; width: 155px; } #large-slideshow-epc .module .details h3 span, #large-slideshow-epc .member--count .details h3 span { color: #D23722; font-size: 1.8em; } .agent-details-module .agent-logo img { width: 100%; margin-bottom: 3px; } .contact-agent .module-title { background: #075ca7; } #large-slideshow-mortgage { text-align: left; } #large-slideshow-mortgage #term { margin-right: 7.5px; } /*------------------------------------* TAGS Used as subtle indicators in the results, usually over the property image /*------------------------------------*/ .tag--photo { position: absolute; top: 0px; left: 0px; padding: 7.5px; color: white; line-height: 1; } .tag--photo > * { color: white; } .tag--photo { font-weight: bold; background: rgba(0, 0, 0, 0.6); } /* +Subnav ------------------------------------------------------------------------------------------- */ #subnav { background: white; border-top: 1px solid #ebe7df; padding: 7.5px 0; margin-bottom: 15px; position: relative; } #subnav .name { margin-right: 0; height: 20px; overflow: hidden; } #subnav .statline, #subnav .inline-list, #subnav .pipe-list { line-height: 30px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #subnav { margin-bottom: 12px; } #subnav .span-4, #subnav .grid .result, .grid #subnav .result, #subnav .span-5, #subnav .span-3 { width: auto; } #subnav .span-4, #subnav .grid .result, .grid #subnav .result { float: right; } } @media only screen and (min-width: 30.0625em) and (max-width: 48em) { #subnav { z-index: 999; } #subnav .span-4, #subnav .grid .result, .grid #subnav .result { position: absolute; right: 15px; margin-top: -57px; } #subnav .span-5 { float: right; margin-right: 0; } } #subnav .module--modal { right: 0; margin-top: 45px; margin-right: -77px; width: 200px; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { #subnav .module--modal { margin-right: 10px; } #subnav .module--modal .module__arrow--top { left: 80%; } } #subnav > .inner-container { position: relative; } #member-nav { text-align: right; } #member-nav > li { margin-right: 0; } .rated, .not-rated { text-decoration: none; cursor: pointer; } .rated { color: gold; } .not-rated { color: grey; } .rating, .property-rating { font-size: 15px; font-size: 15px; } @media only screen and (max-width: 48em) { .rating, .property-rating { font-size: 14.25px; font-size: 14.25px; } } @media only screen and (max-width: 30em) { .rating, .property-rating { font-size: 13.5px; font-size: 13.5px; } } /*------------------------------------* TABLES /*------------------------------------*/ .table--a thead td, .table--a thead th { padding-top: 10px; padding-top: 10px; padding-right: 10px; padding-right: 10px; padding-bottom: 10px; padding-bottom: 10px; padding-left: 10px; padding-left: 10px; text-align: left; vertical-align: middle start; font-size: 12px; font-size: 12px; line-height: 14px; } @media only screen and (max-width: 48em) { .table--a thead td, .table--a thead th { font-size: 11.4px; font-size: 11.4px; } } @media only screen and (max-width: 30em) { .table--a thead td, .table--a thead th { font-size: 10.8px; font-size: 10.8px; } } .table--a tbody td { background-color: #F1E3E1; padding-top: 10px; padding-top: 10px; padding-right: 10px; padding-right: 10px; padding-bottom: 10px; padding-bottom: 10px; padding-left: 10px; padding-left: 10px; font-size: 12px; font-size: 12px; border: 1px solid white; } @media only screen and (max-width: 48em) { .table--a tbody td { font-size: 11.4px; font-size: 11.4px; } } @media only screen and (max-width: 30em) { .table--a tbody td { font-size: 10.8px; font-size: 10.8px; } } .table--a tbody td:last-child { white-space: nowrap; } .table--a .alternate td { background: #FFFBFA; } .table__border td { border: none; } /*------------------------------------* TOOLTIP /*------------------------------------*/ /* Tooltips */ .tooltip { position: relative; background: rgba(0, 0, 0, 0.6); color: white; position: absolute; padding: 1px 15px; margin-left: 2px; } /* Tooltips on links can use the title attribute of the link */ .tooltip--link[data-tooltip] { position: relative; } .tooltip--link[data-tooltip]:before { visibility: hidden; opacity: 0; pointer-events: none; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); } .tooltip--link[data-tooltip]:hover:before { visibility: visible; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=1); } .tooltip--link[data-tooltip]:before { position: absolute; left: 70px; content: attr(data-tooltip); font-weight: normal; color: #a3a3a3; } .tooltip--link[data-tooltip].-pull-right:before { right: 70px; left: auto; } /*------------------------------------* TYPOGRAPHY /*------------------------------------*/ html, body { font-size: 12px; color: #333; font-family: sans-serif; -webkit-font-smoothing: antialiased; background: white; } h1, h2, h3, h4, h5, h6 { font-family: sans-serif; font-weight: bold; margin: 0 0 15px 0; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { h1, h2, h3, h4, h5, h6 { margin-bottom: 12px; } } h1, .huge { font-size: 2em; } h2, .big { font-size: 1.8em; } h3, .large { font-size: 1.4em; } h4, .normal { font-size: 1.2em; } h5, .small { font-size: 1em; } h5, .smaller { font-size: 0.9em; } @media only screen and (min-width: 30.0625em) and (max-width: 64em) { h5, .smaller { font-size: 12px; } } p, ul, ol, dl { margin-top: 0; margin-bottom: 15px; line-height: 1.6em; } .lo, #just-added .added { color: #A3A3A3; } .bordered, .bordered-heading, #services .Blog h3, #services .Advice h3 { border-bottom: 1px solid #333; padding-bottom: 7.5px; } .white, .white:visited { color: white; } .align-right { text-align: right; } .centered, .center { text-align: center; } .primary, .contrast { color: #D23722; } .tertiary { color: green; } .bold { font-weight: bold; } .regular { font-weight: normal; } .dark { color: #333; } p.small-text { font-size: 11px; } .highlighted { -webkit-text-shadow: 0px 1px 1px #222; -moz-text-shadow: 0px 1px 1px #222; text-shadow: 0px 1px 1px #222; display: inline-block; background: rgba(0, 0, 0, 0.25); color: white; padding: 10px; border-bottom: 2px solid rgba(0, 0, 0, 0.35); } em { font-style: italic; } .primary-solid, .module-title { background: #D23722; } .secondary-solid, .search-list .Title, .search-list .Title:hover { background: #075ca7; } /* +Links */ a, .refine-section label { color: #2771c4; text-decoration: underline; -webkit-tap-highlight-color: #99c0eb; outline: none; } a:hover, .refine-section label:hover { text-decoration: none; cursor: pointer; } a.alt-link, .refine-section label.alt-link { color: #9C978E; } .no-link:link, .no-link:visited { color: #333; text-decoration: none; cursor: text; } .no-link:hover { text-decoration: none; } a.lo-link:link, .refine-section label.lo-link:link, a.lo-link:visited, .refine-section label.lo-link:visited { color: #a3a3a3; text-decoration: none; } a.lo-link:hover, .refine-section label.lo-link:hover { text-decoration: underline; color: #333; } .splitter { background: #d6d6d6; height: 1px; margin-bottom: 15px; clear: both; } @font-face { font-family: 'Notepad'; src: url("/fonts/notepad/notepad_-webfont.eot"); src: url("/fonts/notepad/notepad_-webfont.eot?#iefix") format("eot"), url("/fonts/notepad/notepad_-webfont.woff") format("woff"), url("/fonts/notepad/notepad_-webfont.svg#NotepadRegular") format("svg"); font-weight: normal; font-style: normal; } .notepad { font-family: 'Notepad'; font-weight: normal; color: #595959; } .text-xl { font-size: 37px; font-weight: bold; } /* Utilities */ /*------------------------------------* UTILITIES Helpful classes /*------------------------------------*/ /* Layout */ .last { margin-right: 0; } .clear-floats { clear: both; font-size: 0; height: 0; } .-full-width { width: 100%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .-inline { display: inline-block; } .-pull-left { float: left; } .-pull-right { float: right; } .-align-right { text-align: right; } .-align-center { text-align: center; } .-block { display: block; } .-rounded { border-radius: 5px; } /* Spacing */ .padded { padding: 15px; } .padded-vert { padding: 15px 0; } .-padded-half { padding: 7.5px; } .-padded-double { padding: 30px; } .no-padd { padding: 0; } .-mr { margin-right: 15px !important; } .-no-mb, .no-marg { margin-bottom: 0 !important; } .-no-ml { margin-left: 0; } .-mb, .marg-bottom { margin-bottom: 15px !important; } .-mt, .marg-top { margin-top: 15px !important; } .-mr-half { margin-right: 7.5px; } /* Typography */ .-normal-font { font-weight: normal; } .-faded-text { color: #717171; } .-small-text { font-size: 12px; font-size: 12px; } @media only screen and (max-width: 48em) { .-small-text { font-size: 11.4px; font-size: 11.4px; } } @media only screen and (max-width: 30em) { .-small-text { font-size: 10.8px; font-size: 10.8px; } } .-tiny-text { font-size: 10px; font-size: 10px; } @media only screen and (max-width: 48em) { .-tiny-text { font-size: 9.5px; font-size: 9.5px; } } @media only screen and (max-width: 30em) { .-tiny-text { font-size: 9px; font-size: 9px; } } .-no-ul { text-decoration: none; } .large-text, .-u-large { font-size: 15px; font-size: 15px; } @media only screen and (max-width: 48em) { .large-text, .-u-large { font-size: 14.25px; font-size: 14.25px; } } @media only screen and (max-width: 30em) { .large-text, .-u-large { font-size: 13.5px; font-size: 13.5px; } } .larger-text, .-u-larger { font-size: 24px; font-size: 24px; } @media only screen and (max-width: 48em) { .larger-text, .-u-larger { font-size: 22.8px; font-size: 22.8px; } } @media only screen and (max-width: 30em) { .larger-text, .-u-larger { font-size: 21.6px; font-size: 21.6px; } } .medium-text { font-size: 15px; font-size: 15px; } @media only screen and (max-width: 48em) { .medium-text { font-size: 14.25px; font-size: 14.25px; } } @media only screen and (max-width: 30em) { .medium-text { font-size: 13.5px; font-size: 13.5px; } } /* Borders */ .bordered { border: 1px solid #d6d6d6; } .-border-divide { border-bottom: 1px solid #cecece; } /* Colours */ .-lo-color { color: #a3a3a3 !important; } /* Hidden */ .hide .result__price, .hide .result__subtitle, .hide .result__image, .hide .result__details .agent-logo, .hide .result__details .agent-logo-two, .hide .result__actions > .added, .hide .result__actions .FavouriteItemAjax > div, .hide .result__actions .share-property, .hide .result__actions .add-to-favourites-button, .hide .result__summary, .hide .result__development, .hide .result__view-map, .-hidden { display: none !important; } .-block { display: block; margin: 0; } .-tight-right { right: 0; } .-tight-left { left: 0; }