@charset "UTF-8";
/* Functional Mixins */
/* Fonts */
/*------------------------------------
	# 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.
*/
/*------------------------------------
	Website fonts
*/
@font-face {
  font-family: SSStandard;
  font-weight: normal;
  font-style: normal;
  src: url("/fonts/ss-standard/webfonts/ss-standard.eot");
  src: url("/fonts/ss-standard/webfonts/ss-standard.eot?#iefix") format("embedded-opentype"), url("/fonts/ss-standard/webfonts/ss-standard.woff") format("woff"), url("/fonts/ss-standard/webfonts/ss-standard.ttf") format("truetype"), url("/fonts/ss-standard/webfonts/ss-standard.svg#SSStandard") format("svg");
}
@font-face {
  font-family: SSSocialRegular;
  font-weight: normal;
  font-style: normal;
  src: url("/fonts/ss-standard/webfonts/ss-social-regular.eot");
  src: url("/fonts/ss-standard/webfonts/ss-social-regular.eot?#iefix") format("embedded-opentype"), url("/fonts/ss-standard/webfonts/ss-social-regular.woff") format("woff"), url("/fonts/ss-standard/webfonts/ss-social-regular.ttf") format("truetype"), url("/fonts/ss-standard/webfonts/ss-social-regular.svg#SSSocialRegular") format("svg");
}
/* Site Configuration */
/*------------------------------------
	# SITE CONFIGURATION

	To get your site looking the way you want it, start here.
	Just change the values. Don't take anything out. Everything is here for a reason.

*/
/* Site direction */
/* Z-index */
/* Base typography */
/* Font Weight and Style */
/* Site Colours */
/* Headings */
/* Lists */
/* Quotes */
/* Graphical ornaments */
/* Buttons */
/* Forms */
/* Font Sizes */
/* Images */
/* Screen sizes */
/* Media ratios */
/* Template */
/* Modal Box */
/* Framework */
/* Grid */
/* Subject / Object */
/* 1/3 */
/* 2/3 */
/* Tables */
/* Prefixes */
/**
* Developer Mode allows a set of predetermined classes
* to be output by default in the CSS
*/
/* Old IE -- Don't touch */
/* Mixins */
/*------------------------------------
	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
*/
/*------------------------------------
	# 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);
*/
/*------------------------------------
	# ARROW`
*/
/*------------------------------------
	# 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/
*/
.floated, .report-criteria, .vertical-tab-groups, .subnav, .stats-list, .sortable-list li, .ui-sortable.tabs tr, .result, .nav-primary, .global-header, .global-footer, .media-item, .progress-steps, .media, .clear {
  *zoom: 1;
}
.floated:after, .report-criteria:after, .vertical-tab-groups:after, .subnav:after, .stats-list:after, .sortable-list li:after, .ui-sortable.tabs tr:after, .result:after, .nav-primary:after, .global-header:after, .global-footer:after, .media-item:after, .progress-steps:after, .media:after, .clear: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. <div class="video-wrapper">
			<iframe></iframe>
		</div>

	- 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.
*/
.media-item, .progress-steps, .media {
  *zoom: 1;
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  display: block;
}
.media-item:after, .progress-steps:after, .media:after {
  content: "";
  display: table;
  clear: both;
}
@media only screen and (max-width: 48em) {
  .media-item, .progress-steps, .media {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .media-item, .progress-steps, .media {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.media-item:last-child, .progress-steps:last-child, .media:last-child {
  margin-bottom: 0;
}

.progress-steps__num {
  margin-right: 14px;
  margin-right: 0.875rem;
  float: left;
}
.progress-steps__num img {
  width: auto;
}

.progress-steps__text {
  overflow: hidden;
  margin-bottom: 0;
}
.progress-steps__text > :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

/*------------------------------------*/
.tabbed-display #tabbed-display-tabs .tabbed-tab:hover, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:hover, .subnav .menu li a:hover, .add-area-done-button:hover, .range-drop-down .done a:hover, #exportForm input[type=submit]:hover, .search-panel input[type=submit]:hover, .search-panel a.button:hover, .button:hover, .tabbed-display #tabbed-display-tabs .tabbed-tab:active, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:active, .subnav .menu li a:active, .add-area-done-button:active, .range-drop-down .done a:active, #exportForm input[type=submit]:active, .search-panel input[type=submit]:active, .search-panel a.button:active, .button:active {
  text-decoration: none;
}

.tabbed-display #tabbed-display-tabs .tabbed-tab, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search, .subnav .menu li a, .add-area-done-button, .range-drop-down .done a, #exportForm input[type=submit], .search-panel input[type=submit], .search-panel a.button, .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: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  cursor: pointer;
  font-family: "HelveticaNeue", Arial, sans-serif;
  line-height: 32px;
  min-height: 32px;
  white-space: nowrap;
  border: 1px solid;
  border-color: #f2f2f2;
  border-radius: 3px;
}
.tabbed-display #tabbed-display-tabs [disabled].tabbed-tab, #PgAjax-app-filters-SaleProperties #filter-tabs li [disabled].save-search, .subnav .menu li a[disabled], [disabled].add-area-done-button, .range-drop-down .done a[disabled], #exportForm input[disabled][type=submit], .search-panel input[disabled][type=submit], .search-panel a[disabled].button, [disabled].button {
  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

	Make anything have the appearance of a link

*/
input.link, .link, .button--link, .button--link-warning, a {
  color: #196EC8;
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  text-decoration: none;
  outline: none;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 0px;
  padding-left: 0rem;
  padding-right: 0px;
  padding-right: 0rem;
}
.link:hover, .button--link:hover, .button--link-warning:hover, a:hover {
  color: #2f87e5;
  text-decoration: underline;
  background: none;
}
.link:visited, .button--link:visited, .button--link-warning:visited, a:visited {
  color: #246ebd;
}
.link:active, .button--link:active, .button--link-warning:active, a:active {
  color: #c87319;
}

/*------------------------------------
	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
*/
.grid__item {
  float: none;
  width: auto;
}

/**
* 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)
*/
.col-middle, .col-left, .search-panel__inputs > *, .range-drop-down .min-container, .range-drop-down .max-container, .memo-box__actions, .grid--a > *, .grid-12s > *, .grid-11s > *, .grid-10s > *, .grid-9s > *, .grid-8s > *, .grid-7s > *, .grid-6s > *, .grid-5s > *, .grid-4s > *, .grid-3s > *, .grid-2s > * {
  min-height: 1px;
  float: left;
}

.col-middle, .col-left, .search-panel__inputs > *, .range-drop-down .min-container, .range-drop-down .max-container, .memo-box__actions, .grid--a > *, .grid-12s > *, .grid-11s > *, .grid-10s > *, .grid-9s > *, .grid-8s > *, .grid-7s > *, .grid-6s > *, .grid-5s > *, .grid-4s > *, .grid-3s > *, .grid-2s > *, .grid__item {
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
}

/**
* Used to contain a number of grid items, adds negative margins to the left and right
*/
.vertical-tab-groups, .row, .grid, .global-header, #content {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.vertical-tab-groups:after, .row:after, .grid:after, .global-header:after, #content:after {
  content: "";
  display: table;
  clear: both;
}

/**
* 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
*/
.outer-container {
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  max-width: 1024px;
  max-width: 64rem;
}

/* Elements */
/*

    ELEMENTS
    Combines the Normalize (git.io/normalize)
    and the reset at
    csswizardry.com/2011/10/reset-restarted
    with GCD's own preferences

*/
/*------------------------------------
	HTML5 BLOCK ELEMENTS
	Correct `block` display not defined in IE 8/9.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/*------------------------------------
	HTML5 INLINE BLOCK ELEMENTS
	Correct `block` display not defined in IE 8/9.
*/
audio,
canvas,
video {
  display: inline-block;
  max-width: 100%;
}

/*------------------------------------
	Address styling not present in IE 8/9.
*/
[hidden] {
  display: none;
}

/*--------------------------------------
	BOX MODEL
	This works for IE8 and above.
	For IE7, there'll need to be tweaks
*/
/**
* Let’s make the box model all nice, shall we...?
*/
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/*------------------------------------
	Smooth transitions
*/
/*------------------------------------
	Remove margins and padding
*/
h1, h2, h3, h4, h5, h6,
dl, dd, ol, ul,
p, blockquote, pre,
table, th, td, caption,
form, fieldset, legend,
hr {
  margin: 0;
  padding: 0;
}

/*------------------------------------
	Spacing Resets
*/
h1, h2, h3, h4, h5, h6,
ul, ol, dl,
blockquote, p, address,
table,
form, fieldset, figure,
pre {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}
@media only screen and (max-width: 48em) {
  h1, h2, h3, h4, h5, h6,
ul, ol, dl,
blockquote, p, address,
table,
form, fieldset, figure,
pre {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  h1, h2, h3, h4, h5, h6,
ul, ol, dl,
blockquote, p, address,
table,
form, fieldset, figure,
pre {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child,
ul:last-child, ol:last-child, dl:last-child,
blockquote:last-child, p:last-child, address:last-child,
table:last-child,
form:last-child, fieldset:last-child, figure:last-child,
pre:last-child {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}

/*------------------------------------
	HTML & BODY
*/
html {
  font-family: "HelveticaNeue", Arial, sans-serif;
  font-size: 0.875em;
  font-size: 0.875rem;
  font-size-adjust: none;
  direction: ltr;
  line-height: 1.5;
  min-height: 100%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
@media only screen and (max-width: 48em) {
  html {
    font-size: 0.83125em;
  }
}
@media only screen and (max-width: 30em) {
  html {
    font-size: 0.7875em;
  }
}

body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-feature-settings: "liga" 1, "kern" 1;
  -moz-font-feature-settings: "liga=1", "kern=1";
  -ms-font-feature-settings: "liga" 1, "kern" 1;
  -o-font-feature-settings: "liga" 1, "kern" 1;
  -webkit-font-feature-settings: "liga" 1, "kern" 1;
  font-feature-settings: "liga" 1, "kern" 1;
  background: #EEEFF1;
  color: #444444;
  margin: 0;
  position: relative;
  width: 100%;
  -webkit-overflow-scrolling: touch;
}

/*------------------------------------
	SITE DIRECTION
	This should very rarely be touched
*/
/*------------------------------------
	Links
*/
a {
  text-decoration: none;
}
a:focus {
  outline: thin dotted;
}
a:active, a:hover {
  outline: none;
}
a:hover, a:active, a:focus {
  text-decoration: underline;
  outline: none;
}

/*------------------------------------
	Headings
*/
h1 {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 43px;
  font-size: 2.6875rem;
  font-weight: normal;
  line-height: 1.1;
}
@media only screen and (max-width: 48em) {
  h1 {
    font-size: 40.85px;
    font-size: 2.553125rem;
  }
}
@media only screen and (max-width: 30em) {
  h1 {
    font-size: 38.7px;
    font-size: 2.41875rem;
  }
}

h2 {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 35px;
  font-size: 2.1875rem;
  font-weight: normal;
  line-height: 1.1;
}
@media only screen and (max-width: 48em) {
  h2 {
    font-size: 33.25px;
    font-size: 2.078125rem;
  }
}
@media only screen and (max-width: 30em) {
  h2 {
    font-size: 31.5px;
    font-size: 1.96875rem;
  }
}

h3 {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: normal;
  line-height: 1.1;
}
@media only screen and (max-width: 48em) {
  h3 {
    font-size: 26.6px;
    font-size: 1.6625rem;
  }
}
@media only screen and (max-width: 30em) {
  h3 {
    font-size: 25.2px;
    font-size: 1.575rem;
  }
}

h4 {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: normal;
  line-height: 1.1;
}
@media only screen and (max-width: 48em) {
  h4 {
    font-size: 20.9px;
    font-size: 1.30625rem;
  }
}
@media only screen and (max-width: 30em) {
  h4 {
    font-size: 19.8px;
    font-size: 1.2375rem;
  }
}

h5 {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: normal;
  line-height: 1.1;
}
@media only screen and (max-width: 48em) {
  h5 {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  h5 {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}

h6 {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: normal;
  line-height: 1.1;
}
@media only screen and (max-width: 48em) {
  h6 {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  h6 {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

/*------------------------------------
	Lists
*/
ul, ol, dd {
  margin-left: 28px;
  margin-left: 1.75rem;
}

ul {
  list-style: disc;
}

ol {
  list-style: decimal;
}

dt {
  font-weight: bold;
}

/*------------------------------------
	Code
*/
code,
kbd,
pre,
samp {
  font-size: 14px;
  font-size: 0.875rem;
  font-family: Consolas, Monaco, "Andale Mono", monospace -family;
}
@media only screen and (max-width: 48em) {
  code,
kbd,
pre,
samp {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  code,
kbd,
pre,
samp {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

pre {
  white-space: pre-wrap;
}

/*------------------------------------
	Form
*/
/* form */
/* fieldset */
fieldset {
  border: 0;
}

/* label */
label {
  cursor: pointer;
  display: inline;
  margin-right: 7px;
  line-height: 31.5px;
  vertical-align: middle;
}
label input {
  margin-right: 7px;
  margin-right: 0.4375rem;
}

/* input */
button,
input,
select,
textarea {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  font-family: inherit;
  font-size: 100%;
  margin: 0;
}
button[disabled],
input[disabled],
select[disabled],
textarea[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner,
select::-moz-focus-inner,
textarea::-moz-focus-inner {
  border: 0;
  padding: 0;
}

button,
select {
  text-transform: none;
}

input[type=email]:focus, input[type=email]:active, input[type=number]:focus, input[type=number]:active, input[type=password]:focus, input[type=password]:active, input[type=search]:focus, input[type=search]:active, input[type=tel]:focus, input[type=tel]:active, input[type=text]:focus, input[type=text]:active, input[type=url]:focus, input[type=url]:active, input[type=color]:focus, input[type=color]:active, input[type=date]:focus, input[type=date]:active, input[type=datetime]:focus, input[type=datetime]:active, input[type=datetime-local]:focus, input[type=datetime-local]:active, input[type=month]:focus, input[type=month]:active, input[type=time]:focus, input[type=time]:active, input[type=week]:focus, input[type=week]:active {
  cursor: text;
}

input[type=color] {
  line-height: 1;
  padding: 0;
  min-height: 32px;
  min-width: 32px;
}

input[type=radio] {
  padding: 0;
  margin: 0 2px 0 0;
  margin-left: 25px;
}
input[type=radio]:first-child {
  margin-left: 0px;
}

input[type=checkbox] {
  padding: 0;
}

input[type=submit], button {
  margin-right: 7px;
}

/* textarea */
textarea {
  overflow: auto;
  vertical-align: top;
}
textarea:focus, textarea:active {
  cursor: text;
}

/*------------------------------------
	Inline Elements
*/
b {
  font-weight: bold;
}

strong {
  font-weight: bold;
}
strong strong {
  font-weight: bolder;
}

i, em {
  font-style: italic;
}
i i, i em, em i, em em {
  font-style: normal;
}

small {
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 48em) {
  small {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  small {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

u, ins {
  text-decoration: underline;
}

u.typo {
  text-decoration: none;
  border-bottom: 1px dashed #D3412A;
}

dfn {
  font-style: italic;
}

mark {
  color: #444444;
  background-color: #ffff00;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/*------------------------------------
	Quotations
*/
q {
  quotes: "‘" "’" "“" "”";
}
q:before {
  content: "‘";
  content: open-quote;
}
q:after {
  content: "’";
  content: close-quote;
}
q q:before {
  content: "“";
  content: open-quote;
}
q q:after {
  content: "”";
  content: close-quote;
}

blockquote {
  quotes: "“" "”";
  text-indent: -0.41em;
}
blockquote p {
  margin-bottom: 7px;
  margin-bottom: 0.4375rem;
}
@media only screen and (max-width: 48em) {
  blockquote p {
    margin-bottom: 6.65px;
    margin-bottom: 0.415625rem;
  }
}
@media only screen and (max-width: 30em) {
  blockquote p {
    margin-bottom: 6.3px;
    margin-bottom: 0.39375rem;
  }
}
blockquote p:last-child {
  margin-bottom: 0;
}
blockquote p:before {
  content: "“";
  content: open-quote;
}
blockquote p:after {
  content: "";
  content: no-close-quote;
}
blockquote p:last-of-type {
  margin-bottom: 0;
}
blockquote p:last-of-type:after {
  content: "”";
  content: close-quote;
}
blockquote q:before {
  content: "‘";
  content: open-quote;
}
blockquote q:after {
  content: "’";
  content: close-quote;
}
blockquote footer {
  display: block;
  margin-top: 7px;
  text-indent: 0;
}
blockquote footer:before {
  content: "—";
}

/*------------------------------------
	Media
*/
img {
  border: 0;
  font-style: italic;
  max-width: 100%;
}
img[height], img[width] {
  max-width: none;
}
audio:not([controls]) {
  display: none;
  height: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin-top: 0;
  margin-top: 0rem;
  margin-right: 0;
  margin-right: 0rem;
  margin-left: 0;
  margin-left: 0rem;
}
figure > * {
  margin-bottom: 7px;
  margin-bottom: 0.4375rem;
}
@media only screen and (max-width: 48em) {
  figure > * {
    margin-bottom: 6.65px;
    margin-bottom: 0.415625rem;
  }
}
@media only screen and (max-width: 30em) {
  figure > * {
    margin-bottom: 6.3px;
    margin-bottom: 0.39375rem;
  }
}
figure > *:last-child {
  margin-bottom: 0;
}

/*------------------------------------
	Rules
*/
hr {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
  background: rgba(0, 0, 0, 0.1);
  border: 0;
  height: 1px;
}

/*------------------------------------
	Table
*/
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

th:only-of-type {
  text-align: left;
  vertical-align: bottom;
}

td {
  vertical-align: top;
}

/* Cell alignments */
[colspan] {
  text-align: center;
}

[colspan="1"] {
  text-align: left;
}

[rowspan] {
  vertical-align: middle;
}

[rowspan="1"] {
  vertical-align: top;
}

.-disable-hover,
.-disable-hover * {
  pointer-events: none !important;
}

/* Objects */
/*------------------------------------*\

   	ICON

	/ref/patterns.php#icons

/*------------------------------------*/
.vertical-tab-groups #tabs > * a:only-child:after, #filter-tabs li.export:before, #filter-tabs li.manage:before, .menu-icon.-is-active:before, .menu-icon:before, .combo:before, .fc-icon-left-single-arrow:after, .fc-icon-right-single-arrow:after, .progress-steps__step.step--done:after, .modal-box ._close, .social-icon-after:after, .social-icon-before:before, .social-icon, .icon-tiny, .icon-small, .icon-large, .icon-after:after, .icon-before:before, .icon {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  text-rendering: auto;
  font-style: normal;
  font-weight: normal;
  position: relative;
  text-decoration: none;
  white-space: nowrap;
}
.vertical-tab-groups #tabs > * a:hover:only-child:after, #filter-tabs li.export:hover:before, #filter-tabs li.manage:hover:before, .menu-icon:hover:before, .combo:hover:before, .fc-icon-left-single-arrow:hover:after, .fc-icon-right-single-arrow:hover:after, .progress-steps__step.step--done:hover:after, .modal-box ._close:hover, .social-icon-after:hover:after, .social-icon-before:hover:before, .social-icon:hover, .icon-tiny:hover, .icon-small:hover, .icon-large:hover, .icon-after:hover:after, .icon-before:hover:before, .icon:hover {
  text-decoration: none;
}

/*------------------------------------
	# ICON, ICON-BEFORE, ICON-AFTER
	Make an element an icon or append/prepend an element with an icon.
*/
.icon {
  font-size: 0.75em;
  font-family: SSStandard;
}
@media only screen and (max-width: 48em) {
  .icon {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .icon {
    font-size: 0.675em;
  }
}

.icon-before:before {
  font-size: 0.75em;
  content: attr(data-name);
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  .icon-before:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .icon-before:before {
    font-size: 0.675em;
  }
}

.icon-after:after {
  font-size: 0.75em;
  content: attr(data-name);
  font-family: SSStandard;
  margin-left: 7px;
}
@media only screen and (max-width: 48em) {
  .icon-after:after {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .icon-after:after {
    font-size: 0.675em;
  }
}

.icon-large {
  font-size: 0.75em;
  font-family: SSStandard;
  font-size: 28px;
  font-size: 1.75rem;
}
@media only screen and (max-width: 48em) {
  .icon-large {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .icon-large {
    font-size: 0.675em;
  }
}
@media only screen and (max-width: 48em) {
  .icon-large {
    font-size: 26.6px;
    font-size: 1.6625rem;
  }
}
@media only screen and (max-width: 30em) {
  .icon-large {
    font-size: 25.2px;
    font-size: 1.575rem;
  }
}

.icon-small {
  font-size: 0.75em;
  font-family: SSStandard;
  font-size: 18px;
  font-size: 1.125rem;
  vertical-align: middle;
  padding-right: 7px;
}
@media only screen and (max-width: 48em) {
  .icon-small {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .icon-small {
    font-size: 0.675em;
  }
}
@media only screen and (max-width: 48em) {
  .icon-small {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .icon-small {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}

.icon-tiny {
  font-size: 0.75em;
  font-family: SSStandard;
  font-size: 14px;
  font-size: 0.875rem;
  vertical-align: middle;
  padding-right: 7px;
  top: 1px;
}
@media only screen and (max-width: 48em) {
  .icon-tiny {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .icon-tiny {
    font-size: 0.675em;
  }
}
@media only screen and (max-width: 48em) {
  .icon-tiny {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .icon-tiny {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.icon-after {
  padding-left: 10px;
}

/*------------------------------------
	# SOCIAL-ICON, SOCIAL-ICON-BEFORE, SOCIAL-ICON-AFTER
	Make an element an icon or append/prepend an element with an icon.
*/
.social-icon {
  font-size: 0.75em;
  font-family: SSStandard;
}
@media only screen and (max-width: 48em) {
  .social-icon {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .social-icon {
    font-size: 0.675em;
  }
}

.social-icon-before:before {
  font-size: 0.75em;
  content: before;
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  .social-icon-before:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .social-icon-before:before {
    font-size: 0.675em;
  }
}

.social-icon-after:after {
  font-size: 0.75em;
  content: after;
  font-family: SSStandard;
  margin-left: 7px;
}
@media only screen and (max-width: 48em) {
  .social-icon-after:after {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .social-icon-after:after {
    font-size: 0.675em;
  }
}

.icon--has-notification {
  position: relative;
}
.icon--has-notification .notification-count {
  position: absolute;
  top: -4px;
  right: -8px;
}

.notification-count {
  font-size: 12px;
  font-size: 0.75rem;
  background: #d3412a;
  color: white;
  display: block;
  border-radius: 50px;
  width: 20px;
  height: 20px;
  padding: 0 5px;
  border: 2px solid white;
  line-height: 15px;
}
@media only screen and (max-width: 48em) {
  .notification-count {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .notification-count {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.confirmed-icon {
  display: block;
  padding: 7px 0 7px 7px;
}
.confirmed-icon:before {
  content: "👍";
  font-family: SSStandard;
  padding-right: 7px;
}
.confirmed-icon:after {
  content: "Confirmed";
}

.key-icon {
  display: block;
  padding: 7px 0 7px 7px;
}
.key-icon:before {
  content: "🔑";
  font-family: SSStandard;
  padding-right: 7px;
}
.key-icon:after {
  content: "Key Accompanied";
}

.selected-item, .cleanlist {
  list-style: none;
  margin-left: 0;
}
.selected-item > *, .cleanlist > * {
  display: block;
}

.inline-list--b > *, .inlinelist > * {
  display: inline-block;
  vertical-align: baseline;
}

.media-item, .progress-steps, .media {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  display: block;
}
@media only screen and (max-width: 48em) {
  .media-item, .progress-steps, .media {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .media-item, .progress-steps, .media {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.media-item:last-child, .progress-steps:last-child, .media:last-child {
  margin-bottom: 0;
}

.media-item__image, .media_img {
  margin-right: 14px;
  margin-right: 0.875rem;
  float: left;
}
.media-item__image img, .media_img img {
  width: auto;
}

.media-item__body, .media_body {
  overflow: hidden;
  margin-bottom: 0;
}
.media-item__body > :last-child, .media_body > :last-child {
  margin-bottom: 0;
}

/*------------------------------------*\

   	ALERTS

    Designed to style an alert message with a background
    color depending on the type of alert.

	/ref/patterns.php#alert

/*------------------------------------*/
.alert--info, .alert--success, .alert--warning, .alert--error {
  background-color: #444444;
  color: white;
  padding-top: 7px;
  padding-top: 0.4375rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  text-align: center;
  border-radius: 3px;
  margin-top: 14px;
  margin-top: 0.875rem;
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  margin-left: 0;
  margin-left: 0rem;
  margin-right: 0;
  margin-right: 0rem;
}
.alert--info a, .alert--success a, .alert--warning a, .alert--error a {
  color: white;
}

.alert--error {
  background: #D3412A;
  border: 1px solid #a83422;
  color: white;
}

.alert--warning {
  background: #F8BB4E;
  border: 1px solid #f6a81d;
  color: white;
}

.alert--success {
  background: #5BBC67;
  border: 1px solid #42a24e;
  color: white;
}

.alert--info {
  background: rgba(255, 255, 255, 0.5);
  color: #444444;
}

.form-message, .inline--info {
  background-color: #e0e0e0;
  font-size: 14px;
  font-size: 0.875rem;
  border-radius: 3px;
  color: #444444;
  cursor: inherit;
  display: block;
  padding: 6px 10px;
  line-height: 18px;
  opacity: 0.4;
}
@media only screen and (max-width: 48em) {
  .form-message, .inline--info {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .form-message, .inline--info {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.form-message--a {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 14px;
}
@media only screen and (max-width: 48em) {
  .form-message--a {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .form-message--a {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.message--error {
  padding: 3.5px 14px 7px 14px;
  background: #D3412A;
  border-radius: 1.5px;
  border: 1px solid #a83422;
  color: white;
}
.message--error:before {
  content: "×";
  color: white;
  font-weight: bold;
  font-size: 18px;
  padding-right: 8px;
}

.message--success {
  padding: 7px 14px;
  background: #5BBC67;
  border-radius: 1.5px;
  border: 1px solid #42a24e;
  color: white;
}
.message--success:before {
  content: "✔";
  color: white;
  font-weight: bold;
  font-size: 14px;
  padding-right: 8px;
}

.alert--message {
  text-align: center;
  width: 350px;
  display: block;
  margin: 0 auto;
  opacity: 0.3;
}

.alert--archive {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  position: fixed;
  bottom: 14px;
  color: #FFFFFF;
  padding: 9.3333333333px 14px;
  z-index: 6000;
  animation-delay: 0.5s;
}
@media only screen and (max-width: 48em) {
  .alert--archive {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .alert--archive {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

/*------------------------------------*\

   	BLOCKQUOTE

	/ref/patterns.php#blockquote

/*------------------------------------*/
blockquote {
  padding-left: 14px;
  padding-left: 0.875rem;
  border-left: 4px solid #e2dcd0;
}

/*------------------------------------*\

	BOX

	Used as a container. .box includes a smaller
	scale for headings.

	/ref/patterns.php#box

/*------------------------------------*/
.PgFormStepSearch fieldset, .popout-input-content, .quick-search-popup-container, .range-drop-down, .result, .progress-steps, .progress-indicator, .panel-column > .panel, .PropertyList, .WebEdgePropertyList,
.form-wrapper,
.login-panel,
.quick-search-popup-container .dialog-content,
.PgApplicationList,
.PgFormStepAddValuation, .module--dropdown, .dropdown--results, .module--a-full, .module--a .module--a-extended, .alert--message .module--a-extended, .module--a, .alert--message {
  padding: 21px;
  background-color: white;
  border: 1px solid #c3c3c3 !important;
  border-radius: 3px;
  -webkit-overflow-scrolling: touch;
}

.report-criteria, .search-panel, .inactive {
  padding-top: 21px;
  padding-top: 1.3125rem;
  padding-right: 21px;
  padding-right: 1.3125rem;
  padding-bottom: 21px;
  padding-bottom: 1.3125rem;
  padding-left: 21px;
  padding-left: 1.3125rem;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 3px;
}

.module__block-title-b, .module__block-title {
  margin-left: -22px;
  margin-right: -22px;
  margin-top: -22px;
  background-color: #D3412A;
  color: white;
  font-weight: bold;
  padding-top: 7px;
  padding-top: 0.4375rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 21px;
  padding-left: 1.3125rem;
  padding-right: 21px;
  padding-right: 1.3125rem;
  position: relative;
  border-radius: 3px 3px 0 0;
  display: block;
}
.module__block-title-b a, .module__block-title a {
  color: white;
}

.module--c, .help {
  padding: 14px;
  background-color: #e0e0e0;
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}
@media only screen and (max-width: 48em) {
  .module--c, .help {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .module--c, .help {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.module--c:last-child, .help:last-child {
  margin-bottom: 0;
}
.module--c *:last-child, .help *:last-child {
  margin-bottom: 0;
}

.help {
  border-radius: 3px;
}

.module--a .module--a, .alert--message .module--a, .module--a .alert--message, .alert--message .alert--message {
  padding: 7px 14px;
  border-radius: 2px;
}
.module--a-full {
  margin-left: 14px;
  margin-left: 0.875rem;
  margin-right: 14px;
  margin-right: 0.875rem;
}

.module--dropdown, .dropdown--results {
  position: absolute;
  z-index: 7000;
  width: 280px;
}

.module__block-title {
  font-size: 22px;
  font-size: 1.375rem;
}
@media only screen and (max-width: 48em) {
  .module__block-title {
    font-size: 20.9px;
    font-size: 1.30625rem;
  }
}
@media only screen and (max-width: 30em) {
  .module__block-title {
    font-size: 19.8px;
    font-size: 1.2375rem;
  }
}

.module__block-title-b {
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 48em) {
  .module__block-title-b {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .module__block-title-b {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.PropertyList.attach, .WebEdgePropertyList.attach,
.form-wrapper.attach,
.login-panel.attach,
.quick-search-popup-container .dialog-content.attach,
.PgApplicationList.attach,
.PgFormStepAddValuation.attach {
  padding: 0;
  border: none !important;
}

.form-wrapper {
  margin-bottom: 14px;
}
.form-wrapper h3 {
  border-bottom: 1px solid #E0E0E0;
  padding-bottom: 7px;
}

#report-content .PgApplicationList,
.panel-column .PgApplicationList,
.module--a .PgApplicationList,
.alert--message .PgApplicationList {
  padding: 0;
  border: none !important;
  box-shadow: none;
  border-radius: 0;
}

.break {
  margin-bottom: 14px;
}

#brochure-slideshow {
  overflow: hidden;
  width: 100%;
  height: 350px;
}

.slide {
  height: 350px;
  float: left;
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
  background-size: cover;
  background-position: center;
  width: 100%;
  z-index: 1;
  line-height: 350px;
}
.slide img {
  max-height: 350px;
  max-width: 100%;
  line-height: 350px;
  vertical-align: middle;
}

#brochure-next-photo, #brochure-prev-photo {
  position: absolute;
  z-index: 6000;
  line-height: 70px;
  background: rgba(0, 0, 0, 0.3);
  padding: 14px 7px;
  top: 116.6666666667px;
}
#brochure-next-photo:before, #brochure-prev-photo:before {
  font-size: 9px;
  font-size: 0.5625rem;
  font-family: SSStandard;
  color: #FFFFFF;
}
@media only screen and (max-width: 48em) {
  #brochure-next-photo:before, #brochure-prev-photo:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  #brochure-next-photo:before, #brochure-prev-photo:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}
#brochure-next-photo:hover, #brochure-prev-photo:hover, #brochure-next-photo:focus, #brochure-prev-photo:focus {
  text-decoration: none;
  background: rgba(0, 0, 0, 0.6);
  outline: none;
}

#brochure-prev-photo {
  left: 4px;
}
#brochure-prev-photo:before {
  content: "◃";
}

#brochure-next-photo {
  right: 4px;
}
#brochure-next-photo:before {
  content: "▹";
}

/*------------------------------------*\

   	BUTTONS

/*------------------------------------*/
.tabbed-display #tabbed-display-tabs .tabbed-tab, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search, .subnav .menu li a, .add-area-done-button, .range-drop-down .done a, #exportForm input[type=submit], .search-panel input[type=submit], .search-panel a.button, .button {
  background: white;
  border-color: #C3C3C3;
  color: #666666;
  box-shadow: 0 1px 0 #C3C3C3;
}
.tabbed-display #tabbed-display-tabs .tabbed-tab:visited, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:visited, .subnav .menu li a:visited, .add-area-done-button:visited, .range-drop-down .done a:visited, #exportForm input[type=submit]:visited, .search-panel input[type=submit]:visited, .search-panel a.button:visited, .button:visited {
  color: #666666;
}
.tabbed-display #tabbed-display-tabs .tabbed-tab:active, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:active, .subnav .menu li a:active, .add-area-done-button:active, .range-drop-down .done a:active, #exportForm input[type=submit]:active, .search-panel input[type=submit]:active, .search-panel a.button:active, .button:active {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
}
.tabbed-display #tabbed-display-tabs .tabbed-tab:hover, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:hover, .subnav .menu li a:hover, .add-area-done-button:hover, .range-drop-down .done a:hover, #exportForm input[type=submit]:hover, .search-panel input[type=submit]:hover, .search-panel a.button:hover, .button:hover {
  background: #f2f2f2;
  color: #666666;
}
.tabbed-display #tabbed-display-tabs .tabbed-tab:active, #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:active, .subnav .menu li a:active, .add-area-done-button:active, .range-drop-down .done a:active, #exportForm input[type=submit]:active, .search-panel input[type=submit]:active, .search-panel a.button:active, .button:active {
  background: #e6e6e6;
  color: #4d4d4d;
}
.tabbed-display #tabbed-display-tabs [disabled].tabbed-tab, #PgAjax-app-filters-SaleProperties #filter-tabs li [disabled].save-search, .subnav .menu li a[disabled], [disabled].add-area-done-button, .range-drop-down .done a[disabled], #exportForm input[disabled][type=submit], .search-panel input[disabled][type=submit], .search-panel a[disabled].button, [disabled].button {
  background: white;
}
.tabbed-display #tabbed-display-tabs [disabled].tabbed-tab:hover, #PgAjax-app-filters-SaleProperties #filter-tabs li [disabled].save-search:hover, .subnav .menu li a[disabled]:hover, [disabled].add-area-done-button:hover, .range-drop-down .done a[disabled]:hover, #exportForm input[disabled][type=submit]:hover, .search-panel input[disabled][type=submit]:hover, [disabled].button:hover, .tabbed-display #tabbed-display-tabs [disabled].tabbed-tab:active, #PgAjax-app-filters-SaleProperties #filter-tabs li [disabled].save-search:active, .subnav .menu li a[disabled]:active, [disabled].add-area-done-button:active, .range-drop-down .done a[disabled]:active, #exportForm input[disabled][type=submit]:active, .search-panel input[disabled][type=submit]:active, [disabled].button:active {
  background: white;
}

.button {
  margin-top: 3.5px;
}

.button:active {
  top: 2px;
  position: relative;
}

#exportForm input[type=submit], .button--primary, .button.primary {
  background: #D3412A;
  border-color: #a83422;
  color: white;
  box-shadow: 0 1px 0 #a83422;
}
#exportForm input[type=submit]:visited, .button--primary:visited, .button.primary:visited {
  color: white;
}
#exportForm input[type=submit]:active, .button--primary:active, .button.primary:active {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
}
#exportForm input[type=submit]:hover, .button--primary:hover, .button.primary:hover {
  background: #be3a26;
  color: white;
}
#exportForm input[type=submit]:active, .button--primary:active, .button.primary:active {
  background: #a83422;
  color: white;
}
#exportForm input[disabled][type=submit], [disabled].button--primary, [disabled].button.primary {
  background: #D3412A;
}
#exportForm input[disabled][type=submit]:hover, [disabled].button--primary:hover, [disabled].button.primary:hover, #exportForm input[disabled][type=submit]:active, [disabled].button--primary:active, [disabled].button.primary:active {
  background: #D3412A;
}

.button--large {
  font-size: 22px;
  font-size: 1.375rem;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 28px;
  padding-left: 1.75rem;
  padding-right: 28px;
  padding-right: 1.75rem;
  line-height: 48px;
  font-weight: bold;
}
@media only screen and (max-width: 48em) {
  .button--large {
    font-size: 20.9px;
    font-size: 1.30625rem;
  }
}
@media only screen and (max-width: 30em) {
  .button--large {
    font-size: 19.8px;
    font-size: 1.2375rem;
  }
}

.button--add {
  font-size: 14px;
  font-size: 0.875rem;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 9.3333333333px;
  padding-left: 0.5833333333rem;
  padding-right: 9.3333333333px;
  padding-right: 0.5833333333rem;
  line-height: 21.3333333333px;
  font-weight: bold;
  margin-top: 7px;
  margin-top: 0.4375rem;
  margin-right: 0;
  margin-right: 0rem;
  margin-bottom: 0;
  margin-bottom: 0rem;
  margin-left: 0;
  margin-left: 0rem;
}
@media only screen and (max-width: 48em) {
  .button--add {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .button--add {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

#PgAjax-app-filters-SaleProperties #filter-tabs li .save-search, .button--small, td .button {
  font-size: 12px;
  font-size: 0.75rem;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 9.3333333333px;
  padding-left: 0.5833333333rem;
  padding-right: 9.3333333333px;
  padding-right: 0.5833333333rem;
  line-height: 21.3333333333px;
  min-height: 21.3333333333px;
  font-weight: bold;
}
@media only screen and (max-width: 48em) {
  #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search, .button--small, td .button {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  #PgAjax-app-filters-SaleProperties #filter-tabs li .save-search, .button--small, td .button {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.button--link, .button--link-warning {
  box-shadow: none;
  border: none;
  font-weight: normal;
}
.button--link:hover, .button--link-warning:hover {
  background: none;
}

.button--link {
  margin-left: 14px;
}

/* --- Specific button classes that we need to target --- */
.search-panel input[type=submit], .search-panel a.button {
  margin-top: 21px;
  margin-top: 1.3125rem;
  margin-right: 0;
  margin-right: 0rem;
  margin-bottom: 0;
  margin-bottom: 0rem;
  margin-left: 0;
  margin-left: 0rem;
}
@media only screen and (max-width: 48em) {
  .search-panel input[type=submit], .search-panel a.button {
    margin-top: 19.6px;
    margin-top: 1.225rem;
    margin-right: 0;
    margin-right: 0rem;
    margin-bottom: 0;
    margin-bottom: 0rem;
    margin-left: 0;
    margin-left: 0rem;
  }
}
@media only screen and (max-width: 30em) {
  .search-panel input[type=submit], .search-panel a.button {
    margin-top: 14px;
    margin-top: 0.875rem;
    margin-right: 0;
    margin-right: 0rem;
    margin-bottom: 0;
    margin-bottom: 0rem;
    margin-left: 0;
    margin-left: 0rem;
  }
}

.button-group > .button {
  margin-right: 4.6666666667px;
  margin-bottom: 4.6666666667px;
}
.button-group > .button:last-child {
  margin-right: 0;
}

.button-bar {
  text-align: center;
}
.button-bar > .button {
  margin-right: 7px;
}

td .button {
  margin: 3.5px 3.5px 4.6666666667px 3.5px;
}

.button--selected {
  background: none;
  border: 1px dotted #f6a81d;
  color: #f6a81d;
  box-shadow: none;
  outline: none;
}
.button--selected:hover {
  background: none;
  cursor: default;
  color: #f6a81d;
}

#content {
  padding-top: 14px;
  padding-top: 0.875rem;
  padding-right: 21px;
  padding-right: 1.3125rem;
  padding-bottom: 14px;
  padding-bottom: 0.875rem;
  padding-left: 21px;
  padding-left: 1.3125rem;
}

#summary_label, #repeat_every_label {
  font-weight: bold;
}

/*------------------------------------*\

   	BLOCKQUOTE

	/ref/patterns.php#blockquote

/*------------------------------------*/
@-webkit-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@-moz-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@-o-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@-webkit-keyframes slide-in {
  0% {
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-moz-keyframes slide-in {
  0% {
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-o-keyframes slide-in {
  0% {
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes slide-in {
  0% {
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
.dropzone {
  min-height: 150px;
  border: 2px dashed rgba(0, 0, 0, 0.3);
  border-radius: 20px;
  background: white;
  padding: 20px 20px;
  opacity: 0.5;
  -webkit-transition: opacity, 0.4s;
  -moz-transition: opacity, 0.4s;
  transition: opacity, 0.4s;
}
.dropzone .c-dropzone-icons {
  max-width: 100%;
  position: relative;
  text-align: center;
  font-weight: bold;
}
.dropzone .c-dropzone-icons .dropzone-message-icon {
  display: inline-block;
  background: #ededed;
  padding: 28px 28px 7px 28px;
  border-radius: 3px;
  margin: 7px;
  width: 150px;
  border: 4px solid #FFFFFF;
}
.dropzone .c-dropzone-icons .dropzone-message-icon:hover {
  border: 4px solid #082A47;
}
.dropzone .c-dropzone-icons .dropzone-message-icon img {
  max-width: 40px;
}
.dropzone .c-dropzone-icons .dropzone-message-icon .message-name {
  margin-bottom: 0;
}
.dropzone .c-dropzone-icons .dropzone-message-icon .message-format {
  font-size: 9px;
  font-weight: normal;
}

.dropzone:hover {
  opacity: 1;
}

.dz-link-input-placeholder {
  background: #ededed;
  padding: 28px;
  border-radius: 3px;
}
.dz-link-input-placeholder p {
  font-size: 14px;
  font-weight: bold;
}

.dz-link-input {
  margin: 14px 0 !important;
  display: block !important;
  width: 340px !important;
}

.dz-link-input-media {
  float: left;
  margin-right: 14px;
  width: 64px;
}

.dropzone.dz-clickable {
  cursor: pointer;
}

.dropzone.dz-clickable * {
  cursor: default;
}

.dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {
  cursor: pointer;
}

.dropzone.dz-started .dz-message {
  display: none;
}

.dropzone.dz-drag-hover {
  border-style: solid;
}

.dropzone.dz-drag-hover .dz-message {
  opacity: 0.5;
}

.dropzone .dz-message {
  text-align: center;
  margin: 2em 0;
}

.dropzone .dz-preview {
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin: 16px;
  min-height: 100px;
}

.dropzone .dz-preview:hover {
  z-index: 1000;
}

.dropzone .dz-preview:hover .dz-details {
  opacity: 1;
}

.dropzone .dz-preview.dz-file-preview .dz-image {
  border-radius: 20px;
  background: #999;
  background: linear, to bottom, #eee, #ddd;
}

.dropzone .dz-preview.dz-file-preview .dz-details {
  opacity: 1;
}

.dropzone .dz-preview.dz-image-preview {
  background: white;
}

.dropzone .dz-preview.dz-image-preview .dz-details {
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  -ms-transition: opacity 0.2s linear;
  -o-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
}

.dropzone .dz-preview .dz-remove {
  font-size: 14px;
  text-align: center;
  display: block;
  cursor: pointer;
  border: none;
}

.dropzone .dz-preview .dz-remove:hover {
  text-decoration: underline;
}

.dropzone .dz-preview:hover .dz-details {
  opacity: 1;
}

.dropzone .dz-preview .dz-details {
  z-index: 20;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  font-size: 13px;
  min-width: 100%;
  max-width: 100%;
  padding: 2em 1em;
  text-align: center;
  color: rgba(0, 0, 0, 0.9);
  line-height: 150%;
}

.dropzone .dz-preview .dz-details .dz-size {
  margin-bottom: 1em;
  font-size: 16px;
}

.dropzone .dz-preview .dz-details .dz-filename {
  white-space: nowrap;
}

.dropzone .dz-preview .dz-details .dz-filename:hover span {
  border: 1px solid rgba(200, 200, 200, 0.8);
  background-color: rgba(255, 255, 255, 0.8);
}

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
  overflow: hidden;
  text-overflow: ellipsis;
}

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
  border: 1px solid transparent;
}

.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {
  background-color: rgba(255, 255, 255, 0.4);
  padding: 0 0.4em;
  border-radius: 3px;
}

.dropzone .dz-preview:hover .dz-image img {
  -webkit-transform: scale(1.05, 1.05);
  -moz-transform: scale(1.05, 1.05);
  -ms-transform: scale(1.05, 1.05);
  -o-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
  -webkit-filter: blur(8px);
  filter: blur(8px);
}

.dropzone .dz-preview .dz-image {
  border-radius: 20px;
  overflow: hidden;
  width: 120px;
  height: 120px;
  position: relative;
  display: block;
  z-index: 10;
}

.dropzone .dz-preview .dz-image img {
  display: block;
}

.dropzone .dz-preview.dz-success .dz-success-mark {
  -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
}

.dropzone .dz-preview.dz-error .dz-error-mark {
  opacity: 1;
  -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
}

.dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
  pointer-events: none;
  opacity: 0;
  z-index: 500;
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  margin-left: -27px;
  margin-top: -27px;
}

.dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {
  display: block;
  width: 54px;
  height: 54px;
}

.dropzone .dz-preview.dz-processing .dz-progress {
  opacity: 1;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.dropzone .dz-preview.dz-complete .dz-progress {
  opacity: 0;
  -webkit-transition: opacity 0.4s ease-in;
  -moz-transition: opacity 0.4s ease-in;
  -ms-transition: opacity 0.4s ease-in;
  -o-transition: opacity 0.4s ease-in;
  transition: opacity 0.4s ease-in;
}

.dropzone .dz-preview:not(.dz-processing) .dz-progress {
  -webkit-animation: pulse 6s ease infinite;
  -moz-animation: pulse 6s ease infinite;
  -ms-animation: pulse 6s ease infinite;
  -o-animation: pulse 6s ease infinite;
  animation: pulse 6s ease infinite;
}

.dropzone .dz-preview .dz-progress {
  opacity: 1;
  z-index: 1000;
  pointer-events: none;
  position: absolute;
  height: 16px;
  left: 50%;
  top: 50%;
  margin-top: -8px;
  width: 80px;
  margin-left: -40px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-transform: scale(1);
  border-radius: 8px;
  overflow: hidden;
}

.dropzone .dz-preview .dz-progress .dz-upload {
  background: #333;
  background: linear, to bottom, #666, #444;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0;
  -webkit-transition: width 300ms ease-in-out;
  -moz-transition: width 300ms ease-in-out;
  -ms-transition: width 300ms ease-in-out;
  -o-transition: width 300ms ease-in-out;
  transition: width 300ms ease-in-out;
}

.dropzone .dz-preview.dz-error .dz-error-message {
  display: block;
}

.dropzone .dz-preview.dz-error:hover .dz-error-message {
  opacity: 1;
  pointer-events: auto;
}

.dropzone .dz-preview .dz-error-message {
  pointer-events: none;
  z-index: 1000;
  position: absolute;
  display: block;
  display: none;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -ms-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  border-radius: 8px;
  font-size: 13px;
  top: 130px;
  left: -10px;
  width: 140px;
  background: #be2626;
  background: linear, to bottom, #be2626, #a92222;
  padding: 0.5em 1.2em;
  color: white;
}

.dropzone .dz-preview .dz-error-message:after {
  content: "";
  position: absolute;
  top: -6px;
  left: 64px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #be2626;
}

.ImageListItem {
  width: 120px;
  max-height: 185px;
  display: block;
  background: #ffffff;
  text-align: center;
  text-decoration: none;
  margin: 0 15px 15px 0;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 5px;
  float: left;
  padding: 10px;
  position: relative;
}

.ImageListItem .imgctr {
  width: 100px;
  height: 82px;
  overflow: hidden;
  background: #ededed;
  display: table-cell;
  vertical-align: middle;
}

.ImageListItem .imgctr img {
  line-height: 82px;
  vertical-align: middle;
  max-height: 82px;
}

.ImageListRemove {
  width: 25px;
  position: absolute;
  top: -14px;
  right: -14px;
}

.ImageListItem-dropdown select {
  width: 100%;
}

.ImageListItem-input {
  margin-top: 4.6666666667px;
}

.media-list {
  margin: 0;
  padding: 14px 0;
}
.media-list li {
  margin: 14px 7px;
}
.media-list li:hover {
  cursor: move;
}

/*------------------------------------*\

	ERROR HANDLING

/*------------------------------------*/
.error-placeholder {
  font-size: 28px;
  font-size: 1.75rem;
  color: #d3412a;
  position: relative;
  top: 5px;
}
@media only screen and (max-width: 48em) {
  .error-placeholder {
    font-size: 26.6px;
    font-size: 1.6625rem;
  }
}
@media only screen and (max-width: 30em) {
  .error-placeholder {
    font-size: 25.2px;
    font-size: 1.575rem;
  }
}

.error-placeholder.failed {
  display: inline-block;
  clear: both;
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 7px;
  font-weight: bold;
  font-style: normal;
  background-color: #d3412a;
  border-radius: 3px;
  color: #FFFFFF;
  padding: 3px 10px;
  line-height: 21px;
  text-align: center;
  top: auto;
  position: relative;
  margin-left: 6px;
  z-index: 0;
}
@media only screen and (max-width: 48em) {
  .error-placeholder.failed {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .error-placeholder.failed {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}
.error-placeholder.failed:before {
  font-size: 9px;
  font-size: 0.5625rem;
  content: "◃";
  font-family: SSStandard;
  padding-right: 7px;
  color: #d3412a;
  position: absolute;
  left: -6px;
  top: 4px;
}
@media only screen and (max-width: 48em) {
  .error-placeholder.failed:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .error-placeholder.failed:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}

#SectorPicker .error-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
  color: #d3412a;
  background: none;
  font-weight: normal;
  text-align: left;
  margin-left: 0;
  padding: 0;
}
@media only screen and (max-width: 48em) {
  #SectorPicker .error-placeholder {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  #SectorPicker .error-placeholder {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
#SectorPicker .error-placeholder:before {
  content: "";
}

#exportForm div:nth-of-type(1) {
  text-align: center;
  margin-bottom: 14px;
  padding: 7px 0;
  border-bottom: 1px solid #C3C3C3;
  border-top: 1px solid #C3C3C3;
}

#exportForm input[type=submit] {
  display: block;
  margin: 14px auto;
}

.export-columns-check {
  margin: 14px 0;
}

.ui-dialog-titlebar-close .ui-icon-closethick, .ui-dialog-titlebar-close {
  width: 28px !important;
  height: 28px !important;
}

.ui-dialog {
  padding: 0 !important;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
  background-color: white;
  border: 1px solid #c3c3c3 !important;
  border-radius: 3px !important;
  z-index: 90000 !important;
  height: auto !important;
}

.ui-dialog__content-wrapper[style] {
  height: auto !important;
  min-height: 200px !important;
}

.ui-dialog-titlebar {
  font-size: 35px;
  font-size: 2.1875rem;
  padding: 7px 28px !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: normal !important;
}
@media only screen and (max-width: 48em) {
  .ui-dialog-titlebar {
    font-size: 33.25px;
    font-size: 2.078125rem;
  }
}
@media only screen and (max-width: 30em) {
  .ui-dialog-titlebar {
    font-size: 31.5px;
    font-size: 1.96875rem;
  }
}

.ui-dialog-title {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif !important;
}

.ui-dialog-titlebar-close {
  padding: 0 !important;
  right: 20px !important;
  top: 30px !important;
}
.ui-dialog-titlebar-close .ui-icon-closethick {
  background-image: url("/images/sitefiles/close.png") !important;
  background-position: -84px -3px !important;
}
.ui-dialog-titlebar-close:hover .ui-icon-closethick {
  background-position: -4px -3px !important;
}
.ui-dialog-titlebar-close.ui-state-hover {
  background: none !important;
  border: none !important;
}

.ui-dialog-content {
  padding: 0px 28px !important;
}

.ui-widget,
.ui-widget input {
  font-family: "HelveticaNeue", Arial, sans-serif !important;
}

/*------------------------------------*\

   	GLOABAL FOOTER

	For styles specific to the sites global footer

	e.g If you are repeating content from the header
	and want to style it differently.

	/ref/patterns.php#global-footer

/*------------------------------------*/
.global-footer {
  text-align: left;
  background: #eeeff1;
  width: 100%;
}

.global-footer[style] {
  padding: 14px !important;
}

.global-footer__logo img {
  width: 100%;
  max-width: 150px;
}
.global-footer__logo span {
  display: none;
}

.global-footer__terms {
  width: 66%;
  float: left;
  text-align: right;
}
.global-footer__terms a {
  margin-left: 14px;
  margin-bottom: 7px;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 48em) {
  .global-footer__terms a {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .global-footer__terms a {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.global-footer__credits {
  font-size: 12px;
  font-size: 0.75rem;
  width: 33%;
  float: left;
}
@media only screen and (max-width: 48em) {
  .global-footer__credits {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .global-footer__credits {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}
/*------------------------------------*\

   	GLOBAL HEADER

	For styles specific to the sites global header

	e.g Specific styling for your main nav

	/ref/patterns.php#global-header

/*------------------------------------*/
.global-header {
  padding-top: 7px;
  padding-top: 0.4375rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  position: fixed;
  top: 0px;
  right: 0px;
  left: 0px;
  background: #196EC8;
  text-align: left;
  z-index: 8000;
  -webkit-transform: translateZ(0);
  height: 56px;
}
.login .global-header {
  display: none;
}

.global-header__logo {
  width: 240px;
  float: left;
}
@media only screen and (min-width: 48em) {
  .global-header__logo {
    width: 300px;
    margin-top: 7px;
  }
}
@media only screen and (max-width: 30em) {
  .global-header__logo {
    float: left;
    text-align: center;
    display: block;
    padding-top: 0;
    padding-top: 0rem;
    padding-right: 0;
    padding-right: 0rem;
    padding-bottom: 14px;
    padding-bottom: 0.875rem;
    padding-left: 0;
    padding-left: 0rem;
  }
}
.global-header__logo span {
  display: none;
}
.global-header__logo > * {
  line-height: 35px;
}
.global-header__logo h1 {
  margin: 0;
}
.global-header__logo img {
  max-width: 300px;
  width: 100%;
}
@media only screen and (max-width: 48em) {
  .global-header__logo img {
    padding-top: 14px;
  }
}

.global-header__options {
  width: calc(100% - 300px);
  display: inline-block;
}
.global-header__options .options {
  position: relative;
  float: left;
  padding-top: 7px;
}
.global-header__options .options a:hover, .global-header__options .options a:focus {
  text-decoration: none;
}
.global-header__options .options .icon-large {
  margin: 0 9.3333333333px;
  color: #FFFFFF;
  font-size: 22px;
}
.global-header__options .options .icon-large:hover {
  color: #444444;
}
.global-header__options .module--dropdown, .global-header__options .dropdown--results {
  z-index: 9000;
  top: 45px;
}
.global-header__options .dropdown-menu__button {
  font-size: 18px;
  font-size: 1.125rem;
  position: relative;
  top: 0px;
  margin-right: 4.6666666667px;
  display: block;
  color: #C3C3C3;
}
@media only screen and (max-width: 48em) {
  .global-header__options .dropdown-menu__button {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .global-header__options .dropdown-menu__button {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}
.global-header__options .dropdown-menu__button:hover {
  color: #444444;
}
.global-header__options .dropdown-menu li {
  padding: 0;
}

.global-header__welcome-box {
  width: 50%;
  float: right !important;
  /*@include screen-size(sm-min) {
  	@include grid-fraction(3, 12, include);
  }*/
}
@media only screen and (min-width: 48em) {
  .global-header__welcome-box {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 58.3333333333%;
  }
}
.global-header__welcome-box .welcome-box__user {
  display: none;
}
.global-header__welcome-box .status-options {
  display: inline-block;
}
.global-header__welcome-box .status-options a {
  color: #FFFFFF;
  text-decoration: underline;
}

/*.global-header__search {
	@include grid-fraction(5, 12);

	@include screen-size(sm-max) {
		@include grid-fraction(8, 12, include);
	}

	.site-search {
		width: 100%;
		position: relative;

		input[type="search"] {
			padding-left: 30px!important;
			width: 90%;
		}
	}
	.site-search__icon {
		@include position( absolute, 0 0 0 $base-space );
		height: $global-header-height;
		line-height:$global-header-height;
	}
}*/
body.login .login-panel {
  width: 455px;
  margin: 0 auto;
}

body.login #notification > .shell {
  width: 100%;
}

.login-panel__logo {
  padding-top: 0;
  padding-top: 0rem;
  padding-right: 28px;
  padding-right: 1.75rem;
  padding-bottom: 14px;
  padding-bottom: 0.875rem;
  padding-left: 28px;
  padding-left: 1.75rem;
  border-bottom: 1px solid #e2dcd0;
  margin-left: -25.2px;
  margin-right: -25.2px;
  text-align: center;
}
.login-panel__logo img {
  max-width: 300px;
  text-align: center;
  padding: 14px 0;
}

.login-panel fieldset {
  margin-bottom: 0;
  margin-top: 14px;
}
.login-panel fieldset > * {
  border: none;
  box-shadow: none !important;
}

.login-panel input[type=text], input[type=password] {
  height: 35px;
}

/*------------------------------------*\

   	GLOBAL MAIN

   	This is the main section of your page, all
   	content is printed in .global-main

	/ref/patterns.php#global-main

/*------------------------------------*/
.global-main {
  position: relative;
  padding-bottom: 42px;
}
.login .global-main {
  float: none;
  max-width: 1024px;
  margin: 0 auto;
}
@media only screen and (max-width: 30em) {
  .global-main {
    min-height: 0;
  }
}

.global-main-has-steps {
  padding-right: 20%;
}

.global-main-has-steps .page-title {
  margin-right: 0;
}

.error a {
  background-color: #D3412A !important;
  color: white !important;
}

/*------------------------------------*\

   	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

/*------------------------------------*/
@media only screen and (min-width: 48em) {
  .grid__item-1of2 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 50%;
  }
  .grid__item-1of3 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 33.3333333333%;
  }
  .grid__item-2of3 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 66.6666666667%;
  }
  .grid__item-1of4 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 25%;
  }
  .grid__item-2of4 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 50%;
  }
  .grid__item-3of4 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 75%;
  }
  .grid__item-1of5 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 20%;
  }
  .grid__item-2of5 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 40%;
  }
  .grid__item-3of5 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 60%;
  }
  .grid__item-4of5 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 80%;
  }
  .grid__item-1of6 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 16.6666666667%;
  }
  .grid__item-2of6 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 33.3333333333%;
  }
  .grid__item-3of6 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 50%;
  }
  .grid__item-4of6 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 66.6666666667%;
  }
  .grid__item-5of6 {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 83.3333333333%;
  }
}

.grid-1s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-1s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-2s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-2s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-2s > * {
  width: 50%;
}
.grid-2s > *:nth-child(2n+1) {
  clear: both;
}
.grid-3s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-3s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-3s > * {
  width: 33.3333333333%;
}
.grid-3s > *:nth-child(3n+1) {
  clear: both;
}
.grid-4s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-4s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-4s > * {
  width: 25%;
}
.grid-4s > *:nth-child(4n+1) {
  clear: both;
}
.grid-5s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-5s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-5s > * {
  width: 20%;
}
.grid-5s > *:nth-child(5n+1) {
  clear: both;
}
.grid-6s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-6s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-6s > * {
  width: 16.6666666667%;
}
.grid-6s > *:nth-child(6n+1) {
  clear: both;
}
.grid-7s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-7s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-7s > * {
  width: 14.2857142857%;
}
.grid-7s > *:nth-child(7n+1) {
  clear: both;
}
.grid-8s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-8s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-8s > * {
  width: 12.5%;
}
.grid-8s > *:nth-child(8n+1) {
  clear: both;
}
.grid-9s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-9s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-9s > * {
  width: 11.1111111111%;
}
.grid-9s > *:nth-child(9n+1) {
  clear: both;
}
.grid-10s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-10s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-10s > * {
  width: 10%;
}
.grid-10s > *:nth-child(10n+1) {
  clear: both;
}
.grid-11s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-11s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-11s > * {
  width: 9.0909090909%;
}
.grid-11s > *:nth-child(11n+1) {
  clear: both;
}
.grid-12s {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid-12s:after {
  content: "";
  display: table;
  clear: both;
}
.grid-12s > * {
  width: 8.3333333333%;
}
.grid-12s > *:nth-child(12n+1) {
  clear: both;
}
.grid--a {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
}
.grid--a:after {
  content: "";
  display: table;
  clear: both;
}
.grid--a > * {
  width: 50%;
}
.grid--a > *:nth-child(2n+1) {
  clear: both;
}
.grid--b {
  /*@include screen-size(md-max) {
  	@include grid-row-divs(2, include);
  }*/
}
.grid--b .grid-item {
  width: 160px;
  float: left;
  margin: 2px;
  text-align: center;
}

.ui-sortable-placeholder {
  background: #e3e3e3;
  border: 1px dashed #cecece;
  display: block;
  visibility: visible;
}

/*------------------------------------*\

   	LINK


	/ref/patterns.php#link

/*------------------------------------*/
.link--b {
  color: #196EC8;
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  text-decoration: none;
  outline: none;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 0px;
  padding-left: 0rem;
  padding-right: 0px;
  padding-right: 0rem;
}
.link--b:hover {
  color: #2f87e5;
  text-decoration: underline;
  background: none;
}
.link--b:visited {
  color: #246ebd;
}
.link--b:active {
  color: #c87319;
}

input.link {
  cursor: pointer;
}

#memo-items {
  position: relative;
}

#memo-item section {
  display: none !important;
}

.memo-box-container {
  padding: 7px 14px;
  border-bottom: 1px solid #C3C3C3;
}
.memo-box__header {
  border-radius: 2px 2px 0 0;
  background-color: #196EC8;
  color: #FFFFFF;
  font-weight: bold;
  display: block;
  padding: 7px 14px;
}
.memo-box__header a {
  color: #FFFFFF;
}
.memo-box__message {
  width: 100%;
  position: relative;
  height: 316px;
}
.memo-box__inner {
  height: 280px;
  overflow: auto;
}
.memo-box__sender {
  font-weight: bold;
  color: #444444;
  opacity: 0.5;
}
.memo-box__sender:before {
  font-size: 12px;
  font-size: 0.75rem;
  content: "💬";
  font-family: SSStandard;
  padding-right: 7px;
}
@media only screen and (max-width: 48em) {
  .memo-box__sender:before {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .memo-box__sender:before {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}
.memo-box__note {
  color: #575757;
}
.memo-box__empty {
  color: #C3C3C3;
  text-align: center;
  padding: 7px 14px;
  position: relative;
  top: 40%;
  transform: translateY(-40%);
}
.memo-box__empty-icon {
  padding: 14px;
  color: #D3412A !important;
}
.memo-box__action-container {
  position: absolute;
  bottom: 1px;
  width: 100%;
  border-top: 1px solid #C3C3C3;
}
.memo-box__action-container a:first-of-type {
  border-radius: 0 0 0 5px;
}
.memo-box__action-container a:last-of-type {
  border-radius: 0 0 5px 0;
}
.memo-box__actions {
  width: 50%;
  font-weight: bold;
  text-align: center;
  padding: 7px;
  background: #f6f6f6;
}
.memo-box__actions:nth-of-type(even) {
  border-left: 1px solid #C3C3C3;
}
.memo-box__actions:hover {
  background: #e9e9e9;
}
.memo-box__date {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: bold;
  float: right;
  color: #C3C3C3;
  text-transform: uppercase;
}
@media only screen and (max-width: 48em) {
  .memo-box__date {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .memo-box__date {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.memo-button {
  text-align: center;
  display: block;
  position: absolute;
  bottom: 14px;
  margin: 0 auto;
  left: 0;
  right: 0;
}

.AddMemoDialog .memo-link {
  background: none;
  border: none;
  box-shadow: none;
  color: #196EC8 !important;
  padding-left: 0px;
  text-decoration: underline;
  margin-right: 14px;
}
.AddMemoDialog .memo-link:focus {
  outline: 0;
}

#Memo {
  width: 97%;
}

#MemoValidation {
  float: right;
}

.add-memo-container {
  height: 260px;
  overflow-y: scroll;
}

.memo-announcement, .memo-box__announcement {
  font-weight: bold;
  color: #D3412A;
}

/*------------------------------------*\

   	MODAL BOX

	/ref/patterns.php#modal-box

/*------------------------------------*/
.modal-box {
  background-color: #EEEFF1;
  position: fixed;
  right: 50%;
  padding-top: 14px;
  padding-top: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  padding-bottom: 14px;
  padding-bottom: 0.875rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  top: 56px;
  top: 3.5rem;
  margin-right: -300px;
  margin-right: -18.75rem;
  width: 600px;
  width: 37.5rem;
  border-radius: 3px;
  display: none;
  z-index: 9000;
}
.modal-box ._close {
  font-size: 0.75em;
  font-family: SSStandard;
  cursor: pointer;
  float: right;
  opacity: 0.5;
}
@media only screen and (max-width: 48em) {
  .modal-box ._close {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .modal-box ._close {
    font-size: 0.675em;
  }
}
.modal-box ._close:hover {
  opacity: 1;
}
.modal-box ._actions {
  margin-top: 14px;
  text-align: center;
}
@media only screen and (max-width: 48em) {
  .modal-box {
    top: 14px;
    top: 0.875rem;
    right: 14px;
    right: 0.875rem;
    left: 14px;
    left: 0.875rem;
    margin: 0;
    position: fixed;
    width: auto;
  }
}

.modal-box--short {
  height: 260px;
}
.modal-box--short dt {
  display: none !important;
}
.modal-box--short dd {
  margin-top: 28px;
  text-align: center;
  width: 100% !important;
}

.news-item {
  padding-top: 28px;
  padding-top: 1.75rem;
  padding-bottom: 28px;
  padding-bottom: 1.75rem;
  padding-left: 0;
  padding-left: 0rem;
  padding-right: 0;
  padding-right: 0rem;
  border-top: 1px solid #c3c3c3;
  overflow: auto;
}
.news-item.first {
  border: none;
}
.news-item img {
  margin-top: 0px;
  margin-top: 0rem;
  margin-right: 0px;
  margin-right: 0rem;
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  margin-left: 14px;
  margin-left: 0.875rem;
  float: right;
  max-height: 130px;
  max-width: 200px;
}
.news-item h4 {
  margin: 0;
}
.news-item .date {
  color: rgba(68, 68, 68, 0.6);
}
.news-item p:last-of-type {
  margin: 0;
}

/*------------------------------------*\

   	NAV

	/ref/patterns.php#nav

/*------------------------------------*/
.nav-inner {
  position: fixed;
  top: 56px;
  width: 100%;
  z-index: 7000;
}

.nav-primary {
  background: #FFFFFF;
}
@media only screen and (max-width: 48em) {
  .nav-primary .list--nav {
    position: fixed;
    width: 100%;
    max-width: 300px;
    background: #FFFFFF;
    top: 56px;
    z-index: 9000;
    height: 100%;
    border-right: 1px solid #eeeff1;
    display: none;
  }
}
.nav-primary .list--nav li {
  margin: 1.75px;
}
@media only screen and (max-width: 48em) {
  .nav-primary .list--nav li {
    display: block;
    border-bottom: 1px solid #eeeff1;
    margin: 0;
    width: 100%;
  }
}
.nav-primary .list--nav .selected a {
  background: #eeeff1;
}
.nav-primary .list--nav .hovered a {
  background: #d8dadf;
}
.nav-primary .list--nav a {
  color: #5e5e5e;
  text-align: center;
  display: inline-block;
  padding: 14px 18.2px;
  font-weight: bold;
}
@media only screen and (max-width: 48em) {
  .nav-primary .list--nav a {
    display: block;
    text-align: left;
  }
}
.nav-primary .list--nav a:hover {
  text-decoration: none;
}

.nav-primary__mobile {
  display: none;
}
@media only screen and (max-width: 48em) {
  .nav-primary__mobile {
    display: block;
    padding: 7px 21px;
    font-weight: bold;
    font-size: 14px;
    text-align: right;
    width: 50%;
    float: right;
  }
  .nav-primary__mobile:hover, .nav-primary__mobile:active {
    text-decoration: none;
    color: #373737;
  }
}

/* Mobile Menu */
.mobile-menu {
  display: none;
}
@media only screen and (max-width: 48em) {
  .mobile-menu {
    display: block;
  }
}

/*-- Login Styles --*/
.login #logo img {
  max-width: 512px;
}
.login .floated, .login .report-criteria {
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
  background: white;
}
.login .floated input[type=text], .login .report-criteria input[type=text],
.login .floated input[type=password],
.login .report-criteria input[type=password] {
  min-width: 80%;
}
.login h3,
.login .button-bar {
  text-align: center;
}

/*------------------------------------*\

	Notifications

/*------------------------------------*/
.c-notification {
  display: block;
  background-color: #e3e3e3;
  border-radius: 1.5px;
  padding: 7px;
}

.c-notification--info {
  background-color: #EFF4F9;
}

.c-notifications-small {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 48em) {
  .c-notifications-small {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .c-notifications-small {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

#notification-area > .message, #notification-area .warning, #notification-area .button--link-warning {
  color: #FFFFFF;
}

.c-notification--calendar {
  position: absolute;
  top: 4px;
  right: 4px;
  border-radius: 30px;
  padding: 0px 7px;
  color: white;
  text-transform: uppercase;
  line-height: 12px;
  background: rgba(0, 0, 0, 0.3);
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2);
}

/*------------------------------------*\

   	PAGE

	/ref/patterns.php#page

/*------------------------------------*/
.page {
  background-color: #EEEFF1;
  padding-top: 154px;
}
@media only screen and (max-width: 48em) {
  .page {
    padding-top: 140px;
  }
}
.page--has-notification {
  padding-top: 112px !important;
}

.page--short {
  padding-top: 112px !important;
}
@media only screen and (max-width: 48em) {
  .page--short {
    padding-top: 98px !important;
  }
}

.print-invoice {
  display: none;
}

.page-title {
  padding-top: 0;
  padding-top: 0rem;
  padding-right: 0;
  padding-right: 0rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 0;
  padding-left: 0rem;
  font-size: 35px;
  font-size: 2.1875rem;
  margin-right: 35%;
  position: relative;
}
@media only screen and (max-width: 48em) {
  .page-title {
    font-size: 33.25px;
    font-size: 2.078125rem;
  }
}
@media only screen and (max-width: 30em) {
  .page-title {
    font-size: 31.5px;
    font-size: 1.96875rem;
  }
}

.title-buttons {
  position: absolute;
  top: 1px;
  right: 7px;
  width: 45%;
  text-align: right;
}
.title-buttons .button-bar {
  text-align: right;
}

.title-buttons > .button {
  margin-left: 4.6666666667px;
  margin-right: 0;
}

@media (min-width: 1025px) {
  .panel-manager {
    *zoom: 1;
    margin-left: -7px;
    margin-left: -0.4375rem;
    margin-right: -7px;
    margin-right: -0.4375rem;
  }
  .panel-manager:after {
    content: "";
    display: table;
    clear: both;
  }
  .panel-manager > * {
    width: 50%;
  }
  .panel-manager > *:nth-child(2n+1) {
    clear: both;
  }
  .panel-manager > * {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
  }
}

.panel-column > .panel {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}
@media only screen and (max-width: 48em) {
  .panel-column > .panel {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .panel-column > .panel {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.panel-column > .panel:last-child {
  margin-bottom: 0;
}
.panel-column > .panel.add {
  display: none;
  background-color: #196ec8;
  color: white;
  padding-top: 14px;
  padding-top: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  padding-bottom: 14px;
  padding-bottom: 0.875rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  border: 0;
  box-shadow: none;
  cursor: pointer;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}
.panel-column > .panel.add a, .panel-column > .panel.add a:visited {
  color: white;
}
.panel-column > .panel.add:hover {
  background-color: #2f87e5;
  color: white;
}
.panel-column > .panel.add:hover a, .panel-column > .panel.add:hover a:visited {
  color: white;
}
.panel-column > .panel.add:active {
  background-color: #13559b;
  color: white;
}
.panel-column > .panel.add:active a, .panel-column > .panel.add:active a:visited {
  color: white;
}
.panel-column > .panel.inactive {
  min-height: 220px;
  position: relative;
}

.property-panel__image {
  position: relative;
  margin-bottom: 28px;
}
.property-panel__image a {
  color: #444444;
}

.agent-panel__image {
  margin-right: 14px;
  background: white;
}

.property-panel__address {
  padding-top: 0;
  padding-top: 0rem;
  padding-right: 0;
  padding-right: 0rem;
  padding-bottom: 14px;
  padding-bottom: 0.875rem;
  padding-left: 0;
  padding-left: 0rem;
}
.property-panel__address h5 {
  font-weight: bold;
}

.property-panel__catagory {
  padding: 14px 0;
}

.status-highlight {
  color: #d3412a;
}

#property-contact-list, #contact-property-list {
  list-style-type: none;
  padding: 0;
  margin-left: 0px;
}

.inactive {
  padding-top: 70px;
  padding-top: 4.375rem;
  padding-right: 28px;
  padding-right: 1.75rem;
  padding-left: 28px;
  padding-left: 1.75rem;
  padding-bottom: 56px;
  padding-bottom: 3.5rem;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: #FFFFFF;
  max-height: 190px;
  opacity: 0.6;
}
.inactive img {
  width: 40%;
}

.panel--featured-agent {
  font-size: 14px;
  font-size: 0.875rem;
  position: absolute;
  background: #D3412A;
  color: white;
  padding: 0 7px;
  top: 4px;
  left: 4px;
  text-transform: uppercase;
}
@media only screen and (max-width: 48em) {
  .panel--featured-agent {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .panel--featured-agent {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.panel__standard {
  margin-top: 14px;
  padding: 14px;
  background: #f6f6f6;
  border: 2px solid #dddddd !important;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.panel__featured {
  margin-top: 14px;
  padding: 14px;
  background: #fdecce;
  border: 2px solid #face7f !important;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.panel--memo {
  position: relative;
}

.panel--half {
  width: 100%;
}
@media only screen and (min-width: 48em) {
  .panel--half {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 50%;
  }
}

fieldset h3, .panel-content h3 {
  border-bottom: 1px solid #E0E0E0;
  padding-bottom: 7px;
}

.property-panel-title {
  position: relative;
}

.property-panel-toggle {
  position: absolute;
  top: 3.5px;
  right: 0;
}

.panel.not-agreed {
  display: none;
}

/*------------------------------------*\

   	PROGRESS INDICATOR

/*------------------------------------*/
.progress-indicator {
  font-size: 18px;
  font-size: 1.125rem;
  display: none;
  background: url(/images/sitefiles/ajax-progress.gif) no-repeat 16px center white;
  position: fixed;
  top: 10px;
  z-index: 1000;
  margin-left: -180px;
  left: 50%;
  padding: 16px 18px 16px 68px;
  font-weight: bold;
}
@media only screen and (max-width: 48em) {
  .progress-indicator {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .progress-indicator {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}
.progress-indicator p {
  margin-bottom: 0;
}

.ajax-in-progress .progress-indicator {
  display: block;
}

#notification-area.displayed {
  background-color: #D3412A;
  color: white;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  text-align: center;
  padding: 6px 14px;
  z-index: 7000;
  position: relative;
  width: 100%;
  border-bottom: 2px solid #a83422;
  left: 0px;
  top: 0px;
}
#notification-area.displayed a, #notification-area.displayed a:visited {
  color: white;
}
@media only screen and (max-width: 48em) {
  #notification-area.displayed {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  #notification-area.displayed {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
#notification-area.displayed .button {
  color: #444444 !important;
}

body.login #notification-area.displayed {
  padding: 14px;
  position: absolute;
  top: 14px;
}

/*------------------------------------*\

	PROGRESS INDICATOR

/*------------------------------------*/
.progress-steps-section {
  position: fixed;
  top: 125px;
  right: 16px;
  width: 18%;
}

.progress-steps {
  padding: 0;
}

.progress-steps__step {
  padding-top: 18px;
  padding-top: 1.125rem;
  padding-right: 0px;
  padding-right: 0rem;
  padding-bottom: 18px;
  padding-bottom: 1.125rem;
  padding-left: 26px;
  padding-left: 1.625rem;
  clear: both;
  border-top: 1px solid #e0e0e0;
  line-height: 30px;
}
.progress-steps__step.current {
  background-color: white;
}
.progress-steps__step.step--done {
  background-color: white;
}
.progress-steps__step.step--done:after {
  font-size: 0.75em;
  content: "✓";
  font-family: SSStandard;
  margin-left: 7px;
}
@media only screen and (max-width: 48em) {
  .progress-steps__step.step--done:after {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .progress-steps__step.step--done:after {
    font-size: 0.675em;
  }
}
.progress-steps__step.step--done:after {
  float: right;
  margin-right: 14px;
  font-size: 18px;
  font-size: 1.125rem;
  top: 3px;
}
@media only screen and (max-width: 48em) {
  .progress-steps__step.step--done:after {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .progress-steps__step.step--done:after {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}
.progress-steps__step:first-child {
  border-top: none;
  border-radius: 3px 3px 0 0;
}
.progress-steps__step:last-child {
  border-radius: 0 0 3px 3px;
}
@media only screen and (max-width: 48em) {
  .progress-steps__step {
    padding-left: 0;
  }
  .progress-steps__step:first-child {
    border-top: none;
  }
  .progress-steps__step > * {
    display: block;
    float: none !important;
    text-align: center;
    margin-right: 0 !important;
  }
  .progress-steps__step.step--done:after {
    display: none;
  }
}

.progress-steps__num {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: bold;
}
@media only screen and (max-width: 48em) {
  .progress-steps__num {
    font-size: 26.6px;
    font-size: 1.6625rem;
  }
}
@media only screen and (max-width: 30em) {
  .progress-steps__num {
    font-size: 25.2px;
    font-size: 1.575rem;
  }
}

.progress-steps__text {
  line-height: 27px;
}

.result {
  margin-bottom: 14px;
}

.result__image {
  float: left;
  width: 160px;
  margin-right: 14px;
}
.result__image .button {
  padding: 0;
  line-height: 1;
  min-height: 0;
}
.result__image .button label {
  padding: 14px 7px 14px 7px;
  display: inline-block;
}
.result__image .button input {
  margin-left: 14px;
}

.result__details {
  width: 9999px;
  display: table-cell;
}

.result__address {
  font-size: 22px;
}

.result__price {
  font-size: 22px;
}

.result__stats {
  list-style: none;
  margin-left: 0;
}
.result__stats dd, .result__stats li {
  margin-left: 0;
}
.result__stats * > a:only-child {
  display: block;
}
.result__stats > * {
  display: inline-block;
  vertical-align: baseline;
}
.result__stats > li {
  margin-right: 14px;
}

.result__description {
  color: #979797;
}

.result__marketed {
  margin-bottom: 0;
}

.nav-secondary ul {
  list-style: none;
  margin-left: 0;
  background: #eeeff1;
  border-bottom: 1px solid #C3C3C3;
  padding: 9.3333333333px 7px;
  top: 105px;
}
.nav-secondary ul dd, .nav-secondary ul li {
  margin-left: 0;
}
.nav-secondary ul * > a:only-child {
  display: block;
}
.nav-secondary ul > * {
  display: inline-block;
  vertical-align: baseline;
}
@media only screen and (max-width: 48em) {
  .nav-secondary ul {
    top: 93px;
    padding: 7px;
  }
}
.nav-secondary ul ul {
  list-style: none;
  margin-left: 0;
  padding: 9.3333333333px 7px;
  margin: 0 !important;
}
.nav-secondary ul ul dd, .nav-secondary ul ul li {
  margin-left: 0;
}
.nav-secondary ul ul * > a:only-child {
  display: block;
}
.nav-secondary ul ul > * {
  display: inline-block;
  vertical-align: baseline;
}
@media only screen and (max-width: 48em) {
  .nav-secondary ul ul {
    padding: 3.5px 7px;
  }
}
.nav-secondary ul li a {
  color: #196ec8;
  text-decoration: underline;
  padding: 3.5px;
  margin: 0 7px;
}
.nav-secondary ul .selected a {
  background: #eeeff1;
  text-decoration: none;
  color: #444444 !important;
}
.nav-secondary ul .selected a:hover {
  cursor: default;
}

.hovered ul {
  background: #d8dadf;
}

/*------------------------------------*\

	SITE LOGO

	/ref/patterns.php#site-logo

/*------------------------------------*/
.site-logo {
  line-height: 1px;
}
.site-logo img {
  max-height: 35px;
  max-height: 2.1875rem;
}
@media only screen and (max-width: 30em) {
  .site-logo {
    background-image: url("/images/sitefiles/icon.png");
    width: 35px;
    height: 35px;
  }
}
@media only screen and (max-width: 30em) and (-webkit-min-device-pixel-ratio: 1.3), only screen and (max-width: 30em) and (min--moz-device-pixel-ratio: 1.3), only screen and (max-width: 30em) and (-o-min-device-pixel-ratio: 1.3/1), only screen and (max-width: 30em) and (min-resolution: 125dpi), only screen and (max-width: 30em) and (min-resolution: 1.3dppx) {
  .site-logo {
    background-image: url("/images/sitefiles/icon_2x.png");
    background-size: 35px 35px;
  }
}
@media only screen and (max-width: 30em) {
  .site-logo img {
    display: none;
  }
}
.global-header .site-logo {
  float: left;
  margin-right: 14px;
}
@media only screen and (max-width: 48em) {
  .global-header .site-logo {
    margin: 0;
  }
}

/*------------------------------------*\

	SITE SEARCH

	/ref/patterns.php#site-search

/*------------------------------------*/
.site-search input[type=search] {
  display: inline-block;
  vertical-align: baseline;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
  color: #444444;
  background: #ffffff;
  line-height: 26px;
  max-width: 100%;
  min-height: 26px;
  width: auto;
  margin-bottom: 2px;
  font-family: inherit;
  border: 1px solid #C3C3C3;
  border-radius: 3px;
  border: 1px solid #c3c3c3;
  line-height: 35px;
  max-width: 100%;
}

.sms {
  text-align: center;
}

.sms-container {
  background: #FFFFFF;
  border: 1px solid #C3C3C3;
  border-radius: 3px;
  padding: 56px 84px;
  text-align: center;
  margin-bottom: 28px;
}
.sms-container img {
  display: block;
  margin: 0 auto;
}
.sms-container.is-selected {
  background: #eeeff1;
}

.sms-link {
  line-height: 52.5px;
}

.sms-image-container {
  height: 100px;
  width: 100px;
  background: orange;
}

.sync-setup {
  position: relative;
}

.sync-setup__helper {
  width: 35%;
  position: absolute;
  right: 50px;
  top: 130px;
}

/*------------------------------------*\

   	TABLES

	/ref/patterns.php#tables

/*------------------------------------*/
/*
* Extend these table styles for variations of your tables
* NOTE: they should be applied to the table element
*/
table.list thead td, table.list--bordered thead td, table.list thead th, table.list--bordered thead th {
  padding-top: 7px;
  padding-top: 0.4375rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
  background-color: #196ec8;
  color: white;
  text-align: left;
  vertical-align: middle start;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 14px;
}
table.list thead td a, table.list--bordered thead td a, table.list thead th a, table.list--bordered thead th a {
  color: white;
}
@media only screen and (max-width: 48em) {
  table.list thead td, table.list--bordered thead td, table.list thead th, table.list--bordered thead th {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  table.list thead td, table.list--bordered thead td, table.list thead th, table.list--bordered thead th {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
table.list tbody tr, table.list--bordered tbody tr {
  background-color: rgba(255, 255, 255, 0.5);
}
table.list tbody tr:nth-of-type(odd), table.list--bordered tbody tr:nth-of-type(odd) {
  background-color: #EFF4F9;
  /* Override this color in your theme stylesheet */
}
table.list tbody td, table.list--bordered tbody td {
  padding-top: 3.5px;
  padding-top: 0.21875rem;
  padding-bottom: 3.5px;
  padding-bottom: 0.21875rem;
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
  text-align: left;
  vertical-align: middle;
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 48em) {
  table.list tbody td, table.list--bordered tbody td {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  table.list tbody td, table.list--bordered tbody td {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
table.list tbody td:last-child, table.list--bordered tbody td:last-child {
  white-space: nowrap;
}

/*
* For table cell alignment use the following pattern and
* apply to the table or row
*/
/*
* Table cell variations
* NOTE: these should be applied to the table cells
*/
table.list td.tight-cell, table.list--bordered td.tight-cell, table.list th.tight-cell, table.list--bordered th.tight-cell {
  width: 1px;
  white-space: nowrap;
}

table.list td.numerical, table.list--bordered td.numerical, table.list th.numerical, table.list--bordered th.numerical {
  text-align: right;
  -moz-font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
  -moz-font-feature-settings: "kern=1", "lnum=1", "tnum=1";
  -ms-font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
  -o-font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
  -webkit-font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
  font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
}

/*
* Standard table layout
*/
table.list, table.list--bordered {
  width: 100%;
}
table.list caption, table.list--bordered caption, table.list .table-caption, table.list--bordered .table-caption {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: normal;
  line-height: 1.1;
  text-align: center;
}
@media only screen and (max-width: 48em) {
  table.list caption, table.list--bordered caption, table.list .table-caption, table.list--bordered .table-caption {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  table.list caption, table.list--bordered caption, table.list .table-caption, table.list--bordered .table-caption {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}
@media only screen and (max-width: 30em) {
  table.list td.not-on-palm, table.list--bordered td.not-on-palm, table.list th.not-on-palm, table.list--bordered th.not-on-palm {
    display: none;
  }
}
@media only screen and (max-width: 48em) {
  table.list td.not-on-lap, table.list--bordered td.not-on-lap, table.list th.not-on-lap, table.list--bordered th.not-on-lap {
    display: none;
  }
}
@media only screen and (max-width: 48em) {
  table.list td.lose-1, table.list--bordered td.lose-1, table.list th.lose-1, table.list--bordered th.lose-1 {
    display: none;
  }
}
@media only screen and (max-width: 30em) {
  table.list td.lose-2, table.list--bordered td.lose-2, table.list th.lose-2, table.list--bordered th.lose-2 {
    display: none;
  }
}
table.list td .is-cancelled, table.list--bordered td .is-cancelled, table.list th .is-cancelled, table.list--bordered th .is-cancelled {
  color: #D3412A;
  font-weight: bold;
}
table.list th, table.list--bordered th {
  font-weight: bold;
}
table.list th.sorted, table.list--bordered th.sorted {
  background-color: #155da8;
  color: white;
}
table.list th.sorted a, table.list--bordered th.sorted a, table.list th.sorted a:visited {
  color: white;
}
table.list th.sorted:after, table.list--bordered th.sorted:after {
  font-family: ssstandard;
  font-size: 7px;
  margin-left: 4.6666666667px;
}
table.list th.sorted.ascending:after, table.list--bordered th.sorted.ascending:after {
  content: "⬆";
}
table.list th.sorted.descending:after, table.list--bordered th.sorted.descending:after {
  content: "⬇";
}

.table-col {
  background-color: #f4f4f4;
  width: 25%;
  display: inline-block;
  text-align: center;
  padding: 2px 0;
}
.table-col.alternate {
  background-color: #eaeaea;
}

.table-head {
  font-weight: bold;
  margin-right: 4px;
}

#comprises table tr td, #comprises table tr th {
  vertical-align: top;
  border: 0px;
  padding: 3.5px;
  font-size: 12px;
}
#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: #ECE8E0;
}

.table-memo tr td {
  vertical-align: top !important;
  padding: 7px !important;
}
.table-memo tr td:nth-of-type(2) {
  width: 55%;
}

.table-padded td {
  padding: 4.6666666667px 0;
}

.table-equal {
  border-collapse: separate;
  border-spacing: 0 0.5em;
}
.table-equal tr {
  margin-bottom: 7px;
}
.table-equal td {
  background: #f4f4f6;
  padding: 9.3333333333px;
  vertical-align: middle !important;
}
.table-equal .invoice-item-name {
  width: 392px;
  border-radius: 3px 0 0 3px;
}
.table-equal .invoice-item-add-item {
  background: #196ec8;
  width: 40px;
  text-align: center;
  border-radius: 0 3px 3px 0;
  font-weight: bold;
  color: #FFFFFF;
}
.table-equal .invoice-item-add-item:hover {
  cursor: pointer;
  background: #13559b;
}

.terms-of-business td:first-child {
  width: 60px;
}
.terms-of-business td {
  text-align: left;
}

/*------------------------------------*\

	FULL CALANDER

/*------------------------------------*/
#diary-calendar {
  margin-top: 14px;
}

#diary-calendar-appointment {
  margin: 0 auto;
}

.fc-header-left {
  width: 26%;
}

.fc-icon-right-single-arrow:after {
  font-size: 0.75em;
  content: "▹";
  font-family: SSStandard;
  margin-left: 7px;
}
@media only screen and (max-width: 48em) {
  .fc-icon-right-single-arrow:after {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .fc-icon-right-single-arrow:after {
    font-size: 0.675em;
  }
}

.fc-icon-left-single-arrow:after {
  font-size: 0.75em;
  content: "◃";
  font-family: SSStandard;
  margin-left: 7px;
}
@media only screen and (max-width: 48em) {
  .fc-icon-left-single-arrow:after {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .fc-icon-left-single-arrow:after {
    font-size: 0.675em;
  }
}

.fc-icon:after {
  margin-left: 2px;
  top: 1px;
}

.fc-state-active {
  color: #C3C3C3;
  background: white;
}
.fc-state-active:hover {
  color: #C3C3C3;
  background: white;
}

.module--a .fc, .alert--message .fc {
  margin-top: 28px;
  margin-top: 1.75rem;
  margin-bottom: 28px;
  margin-bottom: 1.75rem;
  margin-left: 0;
  margin-left: 0rem;
  margin-right: 0;
  margin-right: 0rem;
  padding-top: 0;
  padding-top: 0rem;
  padding-right: 0;
  padding-right: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 0;
  padding-left: 0rem;
  border: none !important;
  box-shadow: none;
}

.fc-event-vert .fc-event-bg {
  background: transparent;
  opacity: 0.1;
}

.fc-event-container > * {
  z-index: auto;
}

.fc-event-vert .fc-event-inner {
  z-index: 0;
  font-size: 10px;
}

.fc-view-agendaDay .fc-event .fc-event-time {
  padding: 0 6px;
  display: inline-block;
}

.fc-view-agendaWeek .fc-event-time {
  display: none;
}

.fc-view-month .fc-event-inner {
  padding: 4.6666666667px;
  font-size: 10px;
}
.fc-view-month .appointment-staff li {
  padding: 0 !important;
}

.cancelled-event {
  background-color: blue;
}
.cancelled-event .fc-event-inner {
  text-decoration: line-through;
  opacity: 0.2;
}

.fc-event {
  cursor: pointer;
}
.fc-event .fc-event-title {
  font-weight: bold;
  font-size: 10px;
  display: inline-block;
}
.fc-event .appointment-staff {
  list-style: none;
  font-size: 11px;
  margin: 0px 0px 0px 5px;
}
.fc-event .appointment-staff li {
  padding: 2px 6px;
  white-space: nowrap;
}
.fc-event .appointment-staff li:before {
  content: "user";
  font-family: ssstandard;
  font-size: 9px;
  font-size: 0.5625rem;
  margin-right: 4.6666666667px;
}
@media only screen and (max-width: 48em) {
  .fc-event .appointment-staff li:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .appointment-staff li:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}
.fc-event .hover {
  background: white;
  border: 1px solid #cecece;
  border-radius: 3px;
  padding: 14px;
  text-align: left;
  font-size: 14px;
  font-size: 0.875rem;
  opacity: 1;
  z-index: 9999 !important;
  list-style: none;
  width: 275px;
  top: 14px;
  left: 0;
}
@media only screen and (max-width: 48em) {
  .fc-event .hover {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .hover {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
.fc-event .event-hover-title {
  font-weight: bold;
  padding-bottom: 7px;
}
.fc-event .event-hover-time:before {
  content: "time";
  font-family: ssstandard;
  font-size: 9px;
  font-size: 0.5625rem;
  margin-right: 4.6666666667px;
}
@media only screen and (max-width: 48em) {
  .fc-event .event-hover-time:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .event-hover-time:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}
.fc-event .event-hover-staff:before {
  content: "user";
  font-family: ssstandard;
  font-size: 9px;
  font-size: 0.5625rem;
  margin-right: 4.6666666667px;
}
@media only screen and (max-width: 48em) {
  .fc-event .event-hover-staff:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .event-hover-staff:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}
.fc-event .event-hover-contact:before {
  content: "user";
  font-family: ssstandard;
  font-size: 9px;
  font-size: 0.5625rem;
  margin-right: 4.6666666667px;
}
@media only screen and (max-width: 48em) {
  .fc-event .event-hover-contact:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .event-hover-contact:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}
.fc-event .event-hover-notes:before {
  content: "write";
  font-family: ssstandard;
  font-size: 9px;
  font-size: 0.5625rem;
  margin-right: 4.6666666667px;
}
@media only screen and (max-width: 48em) {
  .fc-event .event-hover-notes:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .event-hover-notes:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}
.fc-event.Unconfirmed {
  border-width: 3px;
}
.fc-event .event-hover-sector:before {
  content: "house";
  font-family: ssstandard;
  font-size: 9px;
  font-size: 0.5625rem;
  margin-right: 4.6666666667px;
}
@media only screen and (max-width: 48em) {
  .fc-event .event-hover-sector:before {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .fc-event .event-hover-sector:before {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}

/*------------------------------------*\

	Mini calendar

/*------------------------------------*/
.ui-datepicker {
  width: 280px;
  border-color: #c3c3c3;
}
.ui-datepicker .ui-datepicker-next span {
  width: 14px -1;
  left: 0;
}
.ui-datepicker .ui-datepicker-calendar {
  border-top: 1px dotted #c3c3c3;
  padding-top: 4.6666666667px;
  margin-top: 4.6666666667px;
}
.ui-datepicker td a {
  text-align: center;
}
.ui-datepicker td a:hover {
  text-decoration: underline;
}

.fc-calendar-today {
  font-size: 10px;
  text-transform: uppercase;
  font-weight: bold;
  color: #979797;
  margin-bottom: 0;
}

#diary-filters {
  background: #F7F7F8;
  width: 100%;
  z-index: 9000;
  border: 1px solid #c3c3c3;
}

/*------------------------------------*\

	Original Calender css

/*------------------------------------*/
/*.calendar {
	@include padding($base-space);
	background: white;
	border: 1px solid color(border);
	border-radius: $base-radius*2;
	margin: $margin;
	max-width: 460px;
	&__today {
		line-height: 100px;
		margin: 0;
		.today {
			&__day {
				@include font-size(font-size(gamma));
				@include margin($base-space);
				float: right;
				font-weight: bold;
				line-height: $base-line-height;
			}
			&__date-suffix {
				@include font-size(font-size(epsilon));
			}
			&__date {
				@include font-size(font-size(giga));
				@include margin(n $base-space);
				font-weight: bold;
			}
		}
	}
	&__nav {
		@include margin($base-space 0);
		@include clear;
		list-style: none;
		text-align: center;
		li {
			display:inline;
		}
		.nav {
			line-height:$touch-target;
			&__current {
				font-weight:bold;
			}
			&__next,
			&__prev {
				a {
					@include padding($base-space/2 $base-space/1.5);
					background-color: $x-light-grey;
					border-radius:$base-radius/2;
					color:color(text);
					line-height:inherit;
					&:hover {
						background-color: color(text);
						color:white;
						text-decoration: none;
					}
				}
			}
			&__next {
				@include icon-font;
				float:right;
			}
			&__prev {
				@include icon-font;
				float:left;
			}
		}
	}
	&__table--year {
		table-layout:fixed;
		tr {
			th {
				@include background-color(color(primary));
				@include padding($cell-padding-v $cell-padding-x);
			}
			td {
				@include padding($cell-padding-v $cell-padding-x);
				cursor: pointer;
				height: 40px;
				text-align: right;
				vertical-align: top;
				&.selected {
					background-color: lighten(color(primary), 40%);
				}
				&.today {
					font-weight: bold;
				}
				&:hover {
					@include background-color(color(secondary));
				}
			}
		}
	}
	&__list--week {
		list-style:none;
		margin-left:0;
		li {
			@include vertical-spacing;
			@include padding($base-space/4 $base-space);
			background: $x-light-grey;
			cursor: pointer;
			&.selected {
				@include background-color(color(primary));
				font-weight: bold;
			}
			&:hover {
				@include background-color(color(secondary));
			}
		}
	}
	&__box--day {
		background: $x-light-grey;
		min-height: 263px;
		@include padding($base-space/2 $base-space);
	}
}*/
/*------------------------------------*\

	DIALOG LIST / DROPDOWNS

/*------------------------------------*/
/* Dialog module styles */
.popout-input-content, .quick-search-popup-container, .range-drop-down {
  display: none;
}

/* Dropdown list styles */
.floated dd > div:first-child, .report-criteria dd > div:first-child, .search-panel__fields > div, .StaffFilter-suggestion-autocomplete, .search-grid td, #refine-area-picker, #price-range {
  position: relative;
  display: inline-block;
}

.area-picker__option-list ul, .range-drop-down .list-container, .auto-complete-container > ul, .quick-search-popup-container > ul, .range-drop-down > ul {
  overflow-y: auto;
}

.auto-complete-container, .quick-search-popup-container, .range-drop-down {
  max-height: 250px;
  overflow: hidden;
  overflow-y: scroll;
  z-index: 7000;
  position: absolute;
  left: 0px;
  max-width: 500px;
  background: white;
  border: 1px solid #C3C3C3;
  display: none;
}
.auto-complete-container > p:first-child, .quick-search-popup-container > p:first-child, .range-drop-down > p:first-child {
  padding: 4.6666666667px 7px;
  color: #c3c3c3;
  margin: 0;
  line-height: 32px;
}
.auto-complete-container li, .quick-search-popup-container li, .range-drop-down li {
  padding: 4.6666666667px 7px;
  border-top: 1px solid #e0e0e0;
}
.auto-complete-container li:hover, .quick-search-popup-container li:hover, .range-drop-down li:hover {
  background-color: #e0e0e0;
  cursor: pointer;
}
.auto-complete-container li:first-child, .quick-search-popup-container li:first-child, .range-drop-down li:first-child {
  border-top: none;
}
.auto-complete-container .selected, .quick-search-popup-container .selected, .range-drop-down .selected {
  background-color: #e0e0e0;
  font-weight: bold;
}
.auto-complete-container .selected:hover, .quick-search-popup-container .selected:hover, .range-drop-down .selected:hover {
  background: #e0e0e0;
}
.auto-complete-container .active, .quick-search-popup-container .active, .range-drop-down .active {
  background-color: #e2f1fe;
}

.price-range-drop-down-arrow {
  position: absolute;
  top: 4.6666666667px;
  right: 7px;
  z-index: zindex(dropdown);
}

.range-drop-down {
  padding: 14px 7px;
  width: 125%;
  max-height: 250px;
}
.range-drop-down .min-container, .range-drop-down .max-container {
  width: 50%;
}
.range-drop-down .list-container {
  height: 138px;
  border: 1px solid #c3c3c3;
  margin-bottom: 14px;
  height: 150px;
}
.range-drop-down .heading-type {
  color: inherit;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: normal;
  line-height: 1.1;
  margin-bottom: 7px;
  display: block;
}
@media only screen and (max-width: 48em) {
  .range-drop-down .heading-type {
    font-size: 20.9px;
    font-size: 1.30625rem;
  }
}
@media only screen and (max-width: 30em) {
  .range-drop-down .heading-type {
    font-size: 19.8px;
    font-size: 1.2375rem;
  }
}
.range-drop-down .done a {
  background: white;
  border-color: #C3C3C3;
  color: #666666;
  box-shadow: 0 1px 0 #C3C3C3;
  margin-left: 7px;
}
.range-drop-down .done a:visited {
  color: #666666;
}
.range-drop-down .done a:active {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
}
.range-drop-down .done a:hover {
  background: #f2f2f2;
  color: #666666;
}
.range-drop-down .done a:active {
  background: #e6e6e6;
  color: #4d4d4d;
}
.range-drop-down .done a[disabled] {
  background: white;
}
.range-drop-down .done a[disabled]:hover, .range-drop-down .done a[disabled]:active {
  background: white;
}

.dialog-list__content .loading-spinner {
  position: absolute;
  right: 100px;
  top: 30px;
}

/* Area picker styles */
.quick-search-popup-container {
  width: 700px;
  max-width: 700px;
  left: -90px;
  top: 25px;
}

.area-picker {
  border: 1px solid #c3c3c3;
  height: 152px;
}
.area-picker .bordered-list li {
  padding: 0;
}
.area-picker li {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  padding: 0px 0 0 4px;
  display: block;
}
@media only screen and (max-width: 48em) {
  .area-picker li {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .area-picker li {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
.area-picker li a {
  display: block;
  text-decoration: none;
}
.area-picker li:after {
  font-size: 9px;
  font-size: 0.5625rem;
  color: #c3c3c3;
  content: "▹";
  font-family: ssstandard;
  float: right;
  position: relative;
  top: 1px;
  right: 4px;
}
@media only screen and (max-width: 48em) {
  .area-picker li:after {
    font-size: 8.55px;
    font-size: 0.534375rem;
  }
}
@media only screen and (max-width: 30em) {
  .area-picker li:after {
    font-size: 8.1px;
    font-size: 0.50625rem;
  }
}

.add-area-done-button {
  background: white;
  border-color: #C3C3C3;
  color: #666666;
  box-shadow: 0 1px 0 #C3C3C3;
  background: #D3412A;
  border-color: #a83422;
  color: white;
  box-shadow: 0 1px 0 #a83422;
  position: absolute;
  top: 16px;
  right: 20px;
  font-weight: bold;
}
.add-area-done-button:visited {
  color: #666666;
}
.add-area-done-button:active {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
}
.add-area-done-button:hover {
  background: #f2f2f2;
  color: #666666;
}
.add-area-done-button:active {
  background: #e6e6e6;
  color: #4d4d4d;
}
.add-area-done-button[disabled] {
  background: white;
}
.add-area-done-button[disabled]:hover, .add-area-done-button[disabled]:active {
  background: white;
}
.add-area-done-button:visited {
  color: white;
}
.add-area-done-button:active {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
}
.add-area-done-button:hover {
  background: #be3a26;
  color: white;
}
.add-area-done-button:active {
  background: #a83422;
  color: white;
}
.add-area-done-button[disabled] {
  background: #D3412A;
}
.add-area-done-button[disabled]:hover, .add-area-done-button[disabled]:active {
  background: #D3412A;
}

.area-picker__option-list {
  border-left: 1px solid #c3c3c3;
  vertical-align: top;
}
.area-picker__option-list ul {
  height: 152px;
}
.area-picker__option-list:first-child {
  border-left: none;
}

.area-picker__last-item:after {
  content: "" !important;
}

.area-picker__last-item.picked {
  background-color: #e0e0e0;
  font-weight: bold;
}
.area-picker__last-item.picked:after {
  content: "✓" !important;
  color: #D3412A;
  right: 4px;
}

/* ------
Auto Completes
------- */
.auto-complete-container[style] {
  width: 100% !important;
  min-width: 400px;
}

.contact-dropdown-has-add + .auto-complete-container .list--dropdown li:first-child {
  background: #196EC8;
  color: white;
}
.contact-dropdown-has-add + .auto-complete-container .list--dropdown li:first-child:hover {
  background: #1662b1;
}

/*---- Popouts ----*/
.popout-input-container[style] {
  width: 100% !important;
}

.popout-input-content[style] {
  width: 100% !important;
}

.popout-input-container {
  position: relative;
}

.popout-input-content {
  border-radius: 0 0 3px 3px;
  position: absolute;
  top: 28px;
  padding: 0;
  display: none;
}
.popout-input-content input {
  position: relative;
  top: 13px;
  left: 10px;
}
.popout-input-content .multi-check-text label {
  padding: 9px 33px 8px 32px;
  margin-right: 0;
  border-bottom: 1px solid #c3c3c3;
  cursor: pointer;
  display: block;
}
.popout-input-content .multi-check-text label:hover {
  background-color: #E0E0E0;
}

.popout-input-display {
  display: inline-block;
  vertical-align: baseline;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
  color: #444444;
  background: #ffffff;
  line-height: 26px;
  max-width: 100%;
  min-height: 26px;
  width: auto;
  margin-bottom: 2px;
  font-family: inherit;
  border: 1px solid #C3C3C3;
  overflow: hidden;
  max-height: 30px;
  display: block;
  cursor: pointer;
}
.popout-input-display .label {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 48em) {
  .popout-input-display .label {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .popout-input-display .label {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.popout-input-content {
  max-height: 175px;
  overflow-y: scroll;
}

/* Dropdown arrow button */
.combo {
  background-color: #cecece;
  position: absolute;
  padding: 2px 8px;
  top: 0;
  bottom: 0;
  right: 0;
}
.combo:before {
  font-size: 0.75em;
  content: "▾";
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  .combo:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .combo:before {
    font-size: 0.675em;
  }
}
.combo:before {
  margin-right: 0;
}
.combo:hover {
  background-color: #b5b5b5;
  cursor: pointer;
}

.StaffFilter-suggestion-autocomplete, .search-grid td {
  display: block;
}

.dropdown-menu {
  display: inline-block;
}

.dropdown-menu__button {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  float: right;
}
@media only screen and (max-width: 48em) {
  .dropdown-menu__button {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .dropdown-menu__button {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}

.dropdown-menu li {
  padding: 0;
}
.dropdown-menu li:first-child a {
  border-radius: 3px 3px 0 0;
}
.dropdown-menu li:last-child a {
  border-radius: 0 0 3px 3px;
}

.dropdown-menu li a {
  display: block;
  padding-top: 14px;
  padding-top: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  padding-bottom: 14px;
  padding-bottom: 0.875rem;
  padding-left: 14px;
  padding-left: 0.875rem;
}
.dropdown-menu li a:hover {
  background-color: #e4f0fc;
}

/*------------------------------------*\

   	LISTS

/*------------------------------------*/
.inline-list--b, .inlinelist {
  margin-left: 0;
}
.inline-list--b li, .inlinelist li {
  margin-right: 14px;
  margin-right: 0.875rem;
  display: inline;
}
.inline-list--b dd, .inlinelist dd {
  display: block;
}
.inline-list--b dt, .inlinelist dt {
  margin-bottom: 7px;
  margin-bottom: 0.4375rem;
  margin-right: 7px;
  margin-right: 0.4375rem;
  clear: left;
  float: left;
  white-space: nowrap;
}
@media only screen and (max-width: 48em) {
  .inline-list--b dt, .inlinelist dt {
    margin-bottom: 6.65px;
    margin-bottom: 0.415625rem;
  }
}
@media only screen and (max-width: 30em) {
  .inline-list--b dt, .inlinelist dt {
    margin-bottom: 6.3px;
    margin-bottom: 0.39375rem;
  }
}
.inline-list--b dt:last-child, .inlinelist dt:last-child {
  margin-bottom: 0;
}

.inline-list {
  margin-left: 0;
}
.inline-list li {
  margin-right: 14px;
  margin-right: 0.875rem;
  display: inline;
}
.inline-list dd {
  display: block;
}
.inline-list dt {
  margin-bottom: 7px;
  margin-bottom: 0.4375rem;
  margin-right: 7px;
  margin-right: 0.4375rem;
  clear: left;
  float: left;
  white-space: nowrap;
}
@media only screen and (max-width: 48em) {
  .inline-list dt {
    margin-bottom: 6.65px;
    margin-bottom: 0.415625rem;
  }
}
@media only screen and (max-width: 30em) {
  .inline-list dt {
    margin-bottom: 6.3px;
    margin-bottom: 0.39375rem;
  }
}
.inline-list dt:last-child {
  margin-bottom: 0;
}

.inline-list--b > * {
  padding-top: 0;
  padding-top: 0rem;
  padding-right: 10px;
  padding-right: 0.625rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 0;
  padding-left: 0rem;
  border-right: 1px solid #c3c3c3;
}

ul.checkset, .range-drop-down ul, .quick-search-popup-container ul, .auto-complete-container ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
ul.checkset > *, .range-drop-down ul > *, .quick-search-popup-container ul > *, .auto-complete-container ul > * {
  line-height: 32px;
}

.sortable-list li, .ui-sortable.tabs tr {
  background-color: #F1F1F1;
  display: block;
  padding: 4px 65px 4px 46px;
  position: relative;
  border-radius: 3px;
  box-sizing: content-box;
  margin-bottom: 7px;
  min-height: 20px;
}

.sortable-list li .content {
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  width: 100%;
  line-height: 20px;
}
@media only screen and (max-width: 48em) {
  .sortable-list li .content {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .sortable-list li .content {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.sortable-list li .drag-handle {
  background: url("/images/sitefiles/drag-handles.png") no-repeat center;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  padding: 0 18px;
  cursor: move;
  border-right: 1px solid #e0e0e0;
}
.sortable-list li .drag-handle:hover {
  background: url("/images/sitefiles/drag-handles.png") no-repeat center #e4e4e4;
  border-radius: 5px 0 0 5px;
}

.sortable-list {
  margin-top: 14px;
}

/*.ui-sortable li input {
	@include field();
	width: $content-width;
	margin-bottom: 0;
	@include font-size(font-size(alpha));
}*/
a.edit {
  background: url("/images/sitefiles/edit-icon.png") no-repeat 8px center;
}

a.editdone {
  background: url("/images/sitefiles/done-icon.png") no-repeat 8px center;
}

a.remove {
  background: url("/images/sitefiles/remove-icon.png") no-repeat center center;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 28px;
  border-left: 1px solid #e0e0e0;
}

a.edit, a.editdone {
  position: absolute;
  right: 28px;
  width: 30px;
  top: 0;
  bottom: 0;
  border-left: 1px solid #e0e0e0;
}
a.edit span, a.editdone span {
  display: none;
}

.list, .list--bordered {
  line-height: 21px;
}

.list--clean {
  list-style: none;
  margin-left: 0;
}

.list--bordered {
  list-style: none;
  margin: 0;
  padding: 0;
}

.list--bordered > li {
  border-bottom: 1px solid #C3C3C3;
  padding-top: 7px;
  padding-top: 0.4375rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 0;
  padding-left: 0rem;
  padding-right: 0;
  padding-right: 0rem;
}
.list--bordered > li:last-child {
  border: none;
}

.list--buttons {
  list-style: none;
  margin-left: 0;
}
.list--buttons dd, .list--buttons li {
  margin-left: 0;
}
.list--buttons * > a:only-child {
  display: block;
}
.list--buttons > * {
  display: inline-block;
  vertical-align: baseline;
}

/*.list--dropdown{
  @extend .list;
  @include item-list(vertical);
  @include clear;

  li{
    @include padding($padding/1.5);
    border-bottom: 1px solid map_get( $color, border );

    &:last-child{
      border-bottom: none;
    }

    &:hover{
      background-color:$x-light-grey;
      cursor: pointer;
    }
  }
}*/
ul.checkset .checkset-box, ul.checkset .checkset-label {
  display: inline;
  vertical-align: middle;
}

#FileListContainer .noswfupload ul {
  list-style: none;
  margin: 0;
  margin-bottom: 14px;
}
#FileListContainer .noswfupload ul li {
  display: inline-block;
  border: 1px solid #e3e3e3;
  padding: 7px;
  margin: 4px 4px 4px 0;
}

@media only screen and (max-width: 48em) {
  .list .sector, .list--bordered .sector, .list .property-type, .list--bordered .property-type {
    display: none;
  }
}

.list--activity li p {
  margin-bottom: 0;
}
.list--activity li span {
  font-size: 9px;
  color: #979797;
  font-weight: bold;
}

.list--nav {
  margin: 0 !important;
}

.mceMenu {
  position: static;
  height: 200px;
  max-height: 300px;
  overflow-y: scroll;
}

.mceMenuItem {
  position: static;
  background: #ffffff;
  margin: 0 !important;
}

/*------------------------------------*\

   	MEDIA ITEM

    Designed to although you to quickly place an image
    and body of text beside each other

	/ref/patterns.php#media-item

/*------------------------------------*/
.media-item, .media, .progress-steps {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  display: block;
}
@media only screen and (max-width: 48em) {
  .media-item, .media, .progress-steps {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .media-item, .media, .progress-steps {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.media-item:last-child, .media:last-child, .progress-steps:last-child {
  margin-bottom: 0;
}

.progress-steps__num {
  margin-right: 14px;
  margin-right: 0.875rem;
  float: left;
}
.progress-steps__num img {
  width: auto;
}

.progress-steps__text {
  overflow: hidden;
  margin-bottom: 0;
}
.progress-steps__text > :last-child {
  margin-bottom: 0;
}

/*------------------------------------*\


	MEDIA FLAG

	/ref/patterns.php#media-flag

/*------------------------------------*/
.media-flag {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  display: table;
  width: 100%;
}
@media only screen and (max-width: 48em) {
  .media-flag {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .media-flag {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.media-flag:last-child {
  margin-bottom: 0;
}
.media-flag ._image,
.media-flag ._body {
  display: table-cell;
  vertical-align: middle;
}
.media-flag ._image.-anchor-top,
.media-flag ._body.-anchor-top {
  vertical-align: top;
}
.media-flag ._image.-anchor-bottom,
.media-flag ._body.-anchor-bottom {
  vertical-align: bottom;
}
.media-flag ._image > :last-child,
.media-flag ._body > :last-child {
  margin-bottom: 0;
}
.media-flag ._image {
  padding-right: 14px;
  padding-right: 0.875rem;
}
.media-flag ._image > img {
  display: block;
  max-width: none;
}
.media-flag ._body {
  width: 100%;
}
.media-flag.-anchor-top ._image,
.media-flag.-anchor-top ._body {
  vertical-align: top;
}
.media-flag.-anchor-bottom ._image,
.media-flag.-anchor-bottom ._body {
  vertical-align: bottom;
}

/*------------------------------------*\

   	MENU ICON

	/ref/patterns.php#menu-icon

/*------------------------------------*/
.menu-icon {
  font-size: 18px;
  font-size: 1.125rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  margin-left: 7px;
  margin-left: 0.4375rem;
  background-color: rgba(0, 0, 0, 0.05);
  cursor: pointer;
  display: none;
  float: right;
  line-height: 35px;
}
.menu-icon:before {
  font-size: 0.75em;
  content: "";
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  .menu-icon:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .menu-icon:before {
    font-size: 0.675em;
  }
}
@media only screen and (max-width: 48em) {
  .menu-icon {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .menu-icon {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}
.menu-icon:hover {
  background-color: #196EC8;
  color: white;
  text-decoration: none;
}
.menu-icon:hover a, .menu-icon:hover a:visited {
  color: white;
}
.menu-icon.-is-active {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  background-color: #196EC8;
  color: white;
}
.menu-icon.-is-active a, .menu-icon.-is-active a:visited {
  color: white;
}
.menu-icon.-is-active:before {
  font-size: 0.75em;
  content: "␡";
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  .menu-icon.-is-active:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .menu-icon.-is-active:before {
    font-size: 0.675em;
  }
}
@media only screen and (max-width: 48em) {
  .menu-icon {
    display: block;
  }
}

/*------------------------------------*\

   	OVERLAY

	/ref/patterns.php#overlay

/*------------------------------------*/
.overlay {
  position: fixed;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  z-index: 8000;
}

.pager {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
  line-height: 30px;
}
@media only screen and (max-width: 48em) {
  .pager {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .pager {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.pager:last-child {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}
.pager p {
  line-height: inherit;
}
.pager span, .pager a {
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  display: inline-block;
  vertical-align: baseline;
  border: 1px solid #979797;
  border-left: 0px;
  line-height: inherit;
}
.pager span:first-child, .pager a:first-child {
  border-left: 1px solid #979797;
}
.pager span {
  background-color: #979797;
  color: white;
  color: white;
}
.pager span a, .pager span a:visited {
  color: white;
}
.pager a {
  color: #979797;
}
.pager a:hover {
  background-color: #979797;
  color: white;
  color: white;
  text-decoration: none;
}
.pager a:hover a, .pager a:hover a:visited {
  color: white;
}

/*------------------------------------*\

	IFRAME

/*------------------------------------*/
iframe {
  border: none;
  width: 100%;
}

.image-frame {
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1);
  border: 1px solid #e3e3e3;
  position: relative;
  text-align: center;
}

.WebEdgePropertyList .image-frame {
  width: 112px;
}

.image-frame__image {
  background: #e3e3e3;
  border: 4px solid white;
}
.image-frame__image .helper {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.image-frame__image .featured-agent {
  vertical-align: middle;
  max-height: 170px;
  max-width: 100%;
}
.image-frame__image .vertical-align {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.featured .image-frame__image {
  background: white;
}

.image-frame__image-count {
  background-color: white;
  padding-top: 4px;
  padding-top: 0.25rem;
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  padding-left: 10px;
  padding-left: 0.625rem;
  padding-right: 10px;
  padding-right: 0.625rem;
  position: absolute;
  top: 10px;
  right: 0;
  border-radius: 25px 0 0 25px;
}

.image-frame__preview {
  border: 4px solid white;
  background: #ebebeb;
}
.image-frame__preview img {
  width: 150px;
  height: auto;
  margin-bottom: -6px;
}

.image-center {
  display: block;
  margin: 0 auto;
}

/*------------------------------------*\

	SEARCH PANEL

/*------------------------------------*/
.search-panel {
  margin-bottom: 21px;
}
.search-panel input[type=text],
.search-panel .select-box,
.search-panel dt select,
.search-panel .search-panel__fields select {
  width: 100%;
  max-width: 100%;
}
.search-panel .quick-search {
  float: none;
}
.search-panel input[type=text][style] {
  width: 100% !important;
}
.search-panel select[style] {
  width: 100% !important;
}
@media only screen and (max-width: 48em) {
  .search-panel .quick-search-popup-container {
    left: -360px;
  }
}

.search-panel-title {
  display: none;
}

.search-panel__inputs {
  *zoom: 1;
  margin-left: -7px;
  margin-left: -0.4375rem;
  margin-right: -7px;
  margin-right: -0.4375rem;
  position: relative;
}
.search-panel__inputs:after {
  content: "";
  display: table;
  clear: both;
}
.search-panel__inputs > * {
  width: 25%;
}
.search-panel__inputs > *:nth-child(4n+1) {
  clear: both;
}
.search-panel__inputs > * {
  margin-bottom: 2px;
}
@media only screen and (max-width: 48em) {
  .search-panel__inputs {
    *zoom: 1;
    margin-left: -7px;
    margin-left: -0.4375rem;
    margin-right: -7px;
    margin-right: -0.4375rem;
  }
  .search-panel__inputs:after {
    content: "";
    display: table;
    clear: both;
  }
  .search-panel__inputs > * {
    width: 50%;
  }
  .search-panel__inputs > *:nth-child(2n+1) {
    clear: both;
  }
  .search-panel__inputs > * {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
  }
  .search-panel__inputs .search-panel__fields {
    margin-bottom: 7px;
  }
}
@media only screen and (max-width: 30em) {
  .search-panel__inputs > * {
    float: none;
    width: auto;
  }
  .search-panel__inputs .search-panel__fields {
    margin-bottom: 7px;
  }
}

.search-panel__fields > label {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: bold;
  text-transform: uppercase;
  padding-bottom: 7px;
  display: block;
}
@media only screen and (max-width: 48em) {
  .search-panel__fields > label {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .search-panel__fields > label {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.search-panel__fields > div {
  display: block;
}

.report-criteria {
  border-radius: 0;
}

/*------------------------------------*\

   	SELECTED TOKENS

   	These are the small selected Tokens/Tags found throughout the site when
   	items are selected from certain dropdowns.

/*------------------------------------*/
.selected-item {
  background-color: #d3412a;
  color: white;
  font-size: 14px;
  font-size: 0.875rem;
  display: inline-block;
  position: relative;
  border-radius: 15px;
  margin: 0 4.6666666667px 4px 0;
  padding: 4px 34px 4px 17px;
  line-height: 18px;
}
.selected-item a {
  color: white;
}
@media only screen and (max-width: 48em) {
  .selected-item {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .selected-item {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}
.selected-item a {
  width: 14px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  border-left: 1px solid #f6d8d3;
  text-decoration: none;
  padding-left: 7px;
  padding-right: 16px;
  line-height: 26px;
}
.selected-item a:hover {
  background-color: #d9533e;
  color: white;
  border-radius: 0 25px 25px 0;
}
.selected-item a:hover a {
  color: white;
}
.selected-item:hover {
  cursor: pointer;
}

.search-selections {
  margin: 0 !important;
  line-height: 32px;
}

.selected-item__user-details {
  position: absolute;
  color: #444444;
  width: 250px;
  z-index: 999;
  display: none;
}
.selected-item:hover .selected-item__user-details {
  display: block;
}
.contact-actions:hover .selected-item__user-details {
  display: block;
}

/*------------------------------------*\

	SKIP TO CONTENT

	/ref/patterns.php#skip-to-content

/*------------------------------------*/
.skip-to-content {
  background-color: #D3412A;
  color: white;
  display: block;
  height: 30px;
  line-height: 30px;
  margin-top: -30px;
  white-space: nowrap;
  width: 100%;
  text-align: center;
}
.skip-to-content a, .skip-to-content a:visited {
  color: white;
}
.skip-to-content:focus {
  margin-top: 0;
  text-decoration: none;
}

.stats-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.stats-list__item {
  text-align: center;
  margin-top: 4.6666666667px;
  margin-top: 0.2916666667rem;
  margin-right: 4.6666666667px;
  margin-right: 0.2916666667rem;
  margin-bottom: 4.6666666667px;
  margin-bottom: 0.2916666667rem;
  margin-left: 4.6666666667px;
  margin-left: 0.2916666667rem;
  width: 116.2px;
  font-size: 12px;
  font-size: 0.75rem;
  float: left;
}
@media only screen and (max-width: 48em) {
  .stats-list__item {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .stats-list__item {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.stats-list__number {
  font-size: 43px;
  font-weight: bold;
  line-height: 1;
  padding-top: 14px;
  padding-top: 0.875rem;
  padding-right: 0;
  padding-right: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 0;
  padding-left: 0rem;
  display: block;
}

/*li {
  b {
    display:block;
    font-weight:normal;
    white-space: nowrap;
  }
  span {
    font-size:font-size(zeta);
    font-weight:bold;
    line-height:1;
  }
}

.stats {
	text-align:right;
	li {
		@include vertical-spacing;
	}
}

.stats {
  &--horizontal {

  li {
    @include padding(0 0 $base-radius*2 0);
    @include margin(0 $margin/2 $margin/2 0);
    display: inline-block;
    min-width:115px;
    text-align:center;
    border-radius: $base-radius/2;
  }
}
}*/
#statisticsOuter {
  border-top: 1px solid #E0E0E0;
  border-bottom: 1px solid #E0E0E0;
  padding: 7px 0;
  margin: 14px 0;
}

.stats-list__item--large {
  width: 19%;
  padding: 14px;
}

.stats-list__total {
  font-weight: bold;
  border-bottom: 1px solid #E0E0E0;
  padding-bottom: 7px;
  margin-bottom: 7px;
  font-size: 18px;
}

.stats-list__tag {
  font-size: 9px;
  font-weight: bold;
  text-transform: uppercase;
  color: #979797;
}

#filter-tabs, .subnav .menu {
  line-height: 32px;
  margin-bottom: -1px;
  padding: 0;
}
#filter-tabs li, .subnav .menu li {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  padding-top: 7px;
  padding-top: 0.4375rem;
  padding-bottom: 7px;
  padding-bottom: 0.4375rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  cursor: pointer;
  display: inline-block;
  margin-left: 2px;
}
#filter-tabs li:first-child, .subnav .menu li:first-child {
  margin-left: 0;
}

.subnav .menu li {
  background: white;
}
.subnav .menu li:hover {
  background: #e6e7ea;
}
.subnav .menu li.selected {
  background-color: #D7D2C9;
  font-weight: bold;
}
.subnav .menu li.selected:hover {
  background-color: #D7D2C9;
}

#filter-tabs li {
  background: #d8dadf;
  border-bottom: 1px solid #c3c3c3;
}
#filter-tabs li:hover {
  background: #c4c8ce;
}
#filter-tabs li.selected {
  background: #FFFFFF;
  border: 1px solid #c3c3c3;
  border-bottom-color: white;
  margin-bottom: 1px;
}
#filter-tabs li.selected:hover {
  color: #444444;
}

#filter-tabs li.manage {
  float: right;
  margin-right: 7px;
  padding-right: 8px;
}
#filter-tabs li.manage:before {
  font-size: 0.75em;
  content: "⚙";
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  #filter-tabs li.manage:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  #filter-tabs li.manage:before {
    font-size: 0.675em;
  }
}
#filter-tabs li.manage:before {
  margin-right: 0;
  font-size: 13px;
}
#filter-tabs li.export {
  float: right;
  margin-right: 7px;
  padding-right: 8px;
}
#filter-tabs li.export:before {
  font-size: 0.75em;
  content: "";
  font-family: SSStandard;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  #filter-tabs li.export:before {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  #filter-tabs li.export:before {
    font-size: 0.675em;
  }
}
#filter-tabs li.export:before {
  margin-right: 0;
  font-size: 13px;
}

#tabs {
  margin-left: 42px;
  margin-left: 2.625rem;
}

.subnav {
  padding: 21px 0;
}
.subnav .menu {
  margin-left: 21%;
}
.subnav .menu li {
  margin-left: 4px;
  background: none;
  padding: 0;
}
.subnav .menu li a {
  font-size: 18px;
  font-size: 1.125rem;
  color: #444444;
  text-decoration: none;
}
@media only screen and (max-width: 48em) {
  .subnav .menu li a {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .subnav .menu li a {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}

.vertical-tab-groups {
  position: relative;
}
.vertical-tab-groups #tabs {
  list-style: none;
  margin: 0 -6px 0 -6px;
}
.vertical-tab-groups #tabs > * a:only-child {
  padding-top: 20px;
  padding-top: 1.25rem;
  padding-bottom: 20px;
  padding-bottom: 1.25rem;
  padding-left: 14px;
  padding-left: 0.875rem;
  padding-right: 14px;
  padding-right: 0.875rem;
  font-family: "HelveticaNeue", Arial, sans-serif;
  color: #444444;
  display: block;
  border-bottom: 1px solid #e3e3e3;
  font-size: 14px;
}
.vertical-tab-groups #tabs > * a:only-child:after {
  font-size: 0.75em;
  content: "▻";
  font-family: SSStandard;
  margin-left: 7px;
}
@media only screen and (max-width: 48em) {
  .vertical-tab-groups #tabs > * a:only-child:after {
    font-size: 0.7125em;
  }
}
@media only screen and (max-width: 30em) {
  .vertical-tab-groups #tabs > * a:only-child:after {
    font-size: 0.675em;
  }
}
.vertical-tab-groups #tabs > * a:only-child:hover {
  text-decoration: none;
  background-color: #f4f4f6;
}
.vertical-tab-groups #tabs li:first-child a {
  border-radius: 3px 0 0 0;
}
.vertical-tab-groups #tabs li:last-child a {
  border-bottom: none;
}
.vertical-tab-groups #tabs li.selected a {
  background-color: #ffffff;
  margin-right: -2px;
  font-weight: bold;
}
.vertical-tab-groups #tabs li.selected a:hover {
  background-color: #ffffff;
}
.vertical-tab-groups #tabs li.disabled a {
  color: rgba(0, 0, 0, 0.2);
  cursor: not-allowed;
}

.col-left {
  width: 16.6666666667%;
  position: absolute;
  top: -21px;
  bottom: -21px;
  left: -15px;
  background-color: #f9fafa;
  border-right: 1px solid #e0e0e0;
  border-radius: 6px 0 0 6px;
}

.col-middle {
  width: 83.3333333333%;
  margin-left: 17%;
  min-height: 800px;
}

#PgAjax-app-filters-SaleProperties #filter-tabs li .save-search {
  margin-left: 14px;
}
#PgAjax-app-filters-SaleProperties #filter-tabs li .save-search:after {
  content: "Save Search";
  font-family: "HelveticaNeue", Arial, sans-serif;
}

.tabbed-display {
  font-size: 12px;
}
.tabbed-display #tabbed-display-tabs {
  margin-bottom: 0;
  margin-left: 20px;
}
.tabbed-display #tabbed-display-tabs .tabbed-tab {
  height: 34px;
  list-style-type: none;
  margin-right: 2px;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-bottomright: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  margin-bottom: -1px;
  border-color: #B5B5B5;
  background-color: #f4f4f4;
  box-shadow: none;
}
.tabbed-display #tabbed-display-tabs .tabbed-tab {
  background-color: #FFFFff;
  border-bottom: none;
}
.tabbed-display .tab-views {
  width: 100%;
  border: solid 1px #B5B5B5;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 14px;
}

/*------------------------------------*\

   	TINY MCE

/*------------------------------------*/
table.mceLayout[style] {
  width: 100% !important;
}

/*------------------------------------*\

	UPDATE PANEL

	Panel at the top of tables allowing you to perform updates to bulk table items.

/*------------------------------------*/
.PropertyList .update-panel > *, .WebEdgePropertyList .update-panel > * {
  margin-left: 14px;
}
.PropertyList .update-panel span, .WebEdgePropertyList .update-panel span {
  font-weight: bold;
}

.PropertyList .update-panel, .WebEdgePropertyList .update-panel {
  display: inline-block;
  float: right;
  margin-top: -5px;
  padding-bottom: 7px;
}
.PropertyList th.sortable:hover, .WebEdgePropertyList th.sortable:hover {
  cursor: pointer;
}

/*------------------------------------*\

   	WELCOME BOX

/*------------------------------------*/
.welcome-box {
  margin-bottom: 0;
  float: right;
}

.welcome-box__image {
  display: inline-block;
  line-height: 0;
}
@media only screen and (max-width: 48em) {
  .welcome-box__image {
    display: none;
  }
}
.welcome-box__image img {
  max-height: 40px;
  vertical-align: middle;
}

.welcome-box__body {
  display: inline-block;
  text-align: left;
  float: left;
  padding: 14px 7px;
  max-height: 30px;
}
@media only screen and (max-width: 48em) {
  .welcome-box__body {
    text-align: right;
    padding: 9.3333333333px 7px;
  }
}
.welcome-box__body p {
  color: #FFFFFF;
  line-height: 14px;
}

/*------------------------------------*\

   	VIDEO WRAPPER

    Designed to be used to house a video, either from an
	embedded iframe or a <video> tag.

	Uses the media-box mixin to constrain the aspect ratio
	when you resize the screen.

	/ref/patterns.php#video-wrapper

/*------------------------------------*/
.video-wrapper {
  height: 0px;
  padding-bottom: 56.25%;
  position: relative;
  max-width: 100%;
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}
.video-wrapper iframe {
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
}
@media only screen and (max-width: 48em) {
  .video-wrapper {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .video-wrapper {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.video-wrapper:last-child {
  margin-bottom: 0;
}

/*------------------------------------*\

   	FIELDSET

	/ref/patterns.php#fieldset

/*------------------------------------*/
.field-group {
  margin-bottom: 14px;
  margin-bottom: 0.875rem;
}
@media only screen and (max-width: 48em) {
  .field-group {
    margin-bottom: 13.3px;
    margin-bottom: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .field-group {
    margin-bottom: 12.6px;
    margin-bottom: 0.7875rem;
  }
}
.field-group:last-child {
  margin-bottom: 0;
}
@media only screen and (min-width: 48em) {
  .field-group {
    *zoom: 1;
    *zoom: 1;
    margin-left: -7px;
    margin-left: -0.4375rem;
    margin-right: -7px;
    margin-right: -0.4375rem;
  }
  .field-group:after {
    content: "";
    display: table;
    clear: both;
  }
  .field-group:after {
    content: "";
    display: table;
    clear: both;
  }
}

.field-group__label--full, .field-group__label, .floated dt, .report-criteria dt {
  display: block;
  margin-right: 0;
  color: #979797;
}
@media only screen and (min-width: 48em) {
  .field-group__label--full, .field-group__label, .floated dt, .report-criteria dt {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 25%;
    text-align: right;
    float: left;
  }
}

.field-group__input, .floated dd, .report-criteria dd {
  margin-right: 0;
  margin-left: 0;
  min-height: 32px !important;
}
@media only screen and (min-width: 48em) {
  .field-group__input, .floated dd, .report-criteria dd {
    padding-left: 7px;
    padding-left: 0.4375rem;
    padding-right: 7px;
    padding-right: 0.4375rem;
    min-height: 1px;
    float: left;
    width: 75%;
    float: right;
  }
}

input.hasDatepicker {
  background: url(/framework/images/icons/calendar_select_month.png) no-repeat 98% center white !important;
}

@media only screen and (min-width: 48em) {
  .form-actions {
    text-align: center;
  }
}

fieldset,
.fieldset {
  line-height: 21px;
  margin-bottom: 0 !important;
}

/* Field Group */
.field-group__label--full {
  width: 100%;
  text-align: left;
  padding-left: 0;
}

.floated, .report-criteria {
  padding: 7px 0;
  margin-bottom: 0;
}
.floated dt, .report-criteria dt {
  clear: both;
  font-weight: normal;
  margin-bottom: 4.6666666667px;
}
.floated dd, .report-criteria dd {
  margin-bottom: 4.6666666667px;
  line-height: 22px;
}
.floated dd select, .report-criteria dd select {
  margin-right: 7px;
  margin-right: 0.4375rem;
}
.floated dd textarea, .report-criteria dd textarea {
  width: 100%;
  max-width: 100%;
}
.floated dd .address, .report-criteria dd .address {
  line-height: 18px;
}
.floated dd > div:first-child .auto-complete-container, .report-criteria dd > div:first-child .auto-complete-container {
  display: none;
}
.floated dd > div:first-child.module--a, .report-criteria dd > div:first-child.module--a, .floated dd > div.alert--message:first-child, .report-criteria dd > div.alert--message:first-child {
  display: block;
}

.floated--clean {
  padding: 0;
  border: 0;
  margin-bottom: 14px;
}

fieldset dd .google-map[style] {
  width: 100% !important;
}

fieldset dd .google-map {
  margin-bottom: 14px;
}

.PgFormStepAddValuation fieldset .floated, .PgFormStepAddValuation fieldset .report-criteria {
  margin-bottom: 0;
}

.inline--checkboxes {
  padding-top: 0;
  padding-top: 0rem;
  padding-right: 0;
  padding-right: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 14px;
  padding-left: 0.875rem;
}

input[type=text].price-range-value {
  width: 308px;
}

.char-count {
  background-color: #e0e0e0;
  font-size: 14px;
  font-size: 0.875rem;
  text-align: center;
  border: none;
  border-radius: 1.5px;
  padding: 4px;
  margin-right: 7px;
}
@media only screen and (max-width: 48em) {
  .char-count {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .char-count {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

#PropertySelector-search {
  width: 240px;
  margin-right: 7px;
}

/*------------------------------------*\

   	TEXT FIELD

    Defines the basic properties of text fields.

	/ref/patterns.php#text-fields

/*------------------------------------*/
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],
.text-field {
  display: inline-block;
  vertical-align: baseline;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
  color: #444444;
  background: #ffffff;
  line-height: 26px;
  max-width: 100%;
  min-height: 26px;
  width: auto;
  margin-bottom: 2px;
  font-family: inherit;
  border: 1px solid #C3C3C3;
  box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}

input[type=color] {
  padding: 0;
}
input[type=color][list] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  min-width: 64px;
  padding: 0;
}

textarea {
  display: inline-block;
  vertical-align: baseline;
  padding-top: 0;
  padding-top: 0rem;
  padding-bottom: 0;
  padding-bottom: 0rem;
  padding-left: 7px;
  padding-left: 0.4375rem;
  padding-right: 7px;
  padding-right: 0.4375rem;
  color: #444444;
  background: #ffffff;
  line-height: 26px;
  max-width: 100%;
  min-height: 26px;
  width: 100%;
  margin-bottom: 2px;
  font-family: inherit;
  border: 1px solid #C3C3C3;
  padding-top: 3.5px;
  padding-top: 0.21875rem;
  padding-bottom: 3.5px;
  padding-bottom: 0.21875rem;
  line-height: 21px;
  line-height: 1.3125rem;
  max-width: 400px;
  max-width: 25rem;
  min-height: 100px;
  min-height: 6.25rem;
}

/*------------------------------------*\

	SANDBOX

	Use this for experiments. Remember to break it into objects when you're finished.
	This file shouldn't make it into the final site.

	/ref/patterns.php#sandbox

/*------------------------------------*/
/* Properties */
/*------------------------------------
	Frame
*/
.padded {
  padding: 14px;
}

.padded-x {
  padding: 28px;
}

.padded-ns {
  padding: 7px 0;
}

.padded-lg-ns {
  padding: 14px 0;
}

.rounded {
  border-radius: 3px;
}

.bordered {
  border: 1px solid #C3C3C3;
}

.block {
  display: block;
}

.marg-bottom, .u-mb {
  margin-bottom: 14px;
}

.marg-ns {
  margin: 9.3333333333px 0;
}

.no-marg {
  margin-bottom: 0 !important;
}

.nudge-right {
  margin-left: 14px;
}

.nudge-left {
  margin-right: 28px;
  margin-bottom: 14px;
}

.align-center {
  text-align: center;
}

.align-left {
  text-align: left;
}

/*------------------------------------
	Polish
*/
.well {
  box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}

.raised {
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}

.centered {
  text-align: center;
}

.warning, .button--link-warning {
  color: #D3412A;
}

.-disable-hover,
.-disable-hover * {
  pointer-events: none !important;
}

ul.clean--list, ol.clean--list, dl.clean--list {
  list-style: none;
  margin-left: 0;
}
ul.clean--list dd, ul.clean--list li, ol.clean--list dd, ol.clean--list li, dl.clean--list dd, dl.clean--list li {
  margin-left: 0;
}
.-pull-right {
  float: right;
}

.error--highlight {
  color: #d3412a;
}

.info--highlight {
  color: #196EC8;
}

.lighten {
  color: #E0E0E0;
}

.bold {
  font-family: "HelveticaNeue", Arial, sans-serif;
  font-weight: bold;
}

.bold-red {
  color: #D3412A;
  font-weight: bold;
}

.small-text {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 48em) {
  .small-text {
    font-size: 13.3px;
    font-size: 0.83125rem;
  }
}
@media only screen and (max-width: 30em) {
  .small-text {
    font-size: 12.6px;
    font-size: 0.7875rem;
  }
}

.larger-text {
  font-size: 18px;
  font-size: 1.125rem;
}
@media only screen and (max-width: 48em) {
  .larger-text {
    font-size: 17.1px;
    font-size: 1.06875rem;
  }
}
@media only screen and (max-width: 30em) {
  .larger-text {
    font-size: 16.2px;
    font-size: 1.0125rem;
  }
}

.center {
  text-align: center;
}

.helper {
  font-weight: bold;
  cursor: pointer;
  background: #dddddd;
  padding: 5.1851851852px 7px;
  border-radius: 1.5px;
}

.best-tag {
  font-size: 12px;
  font-size: 0.75rem;
  border-radius: 1.5px;
  background: #f6a81d;
  width: 155px;
  padding: 3.5px;
  text-align: center;
  position: absolute;
  top: -13px;
  right: 7px;
  color: black;
}
@media only screen and (max-width: 48em) {
  .best-tag {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .best-tag {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}
.best-tag span {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 10px;
  color: white;
}

/*----------------------------------
----- .unread class to be ----------
----- removed from body text -------
----- and moved to parent div ------
----------------------------------*/
.unread {
  background: #cee3f9;
}
.unread:hover {
  cursor: pointer;
}
.unread .memo-box__date, .unread .memo-box__sender {
  color: #444444 !important;
  opacity: 1;
}

.counter {
  display: block;
  position: absolute;
  top: -2px;
  left: 22px;
  line-height: 16px;
  height: 16px;
  padding: 0 5px;
  color: white;
  border-radius: 9px;
  background: #D3412A;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 48em) {
  .counter {
    font-size: 11.4px;
    font-size: 0.7125rem;
  }
}
@media only screen and (max-width: 30em) {
  .counter {
    font-size: 10.8px;
    font-size: 0.675rem;
  }
}

.fake-link {
  cursor: pointer;
  font-size: 12px;
}

.unselectable {
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.clear {
  overflow: auto;
  zoom: 1;
}

/*# sourceMappingURL=screen.css.map */