/* ---------- Base ---------- */

*
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.top_logo, .top_adh, .detail_brief, .detail_specs, .detail_spec_table, .contentskyscraper_skyscraper, .grid_1_2, .grid_1_4, .grid_3_4, .listing_content { *behavior: url(/framework/js_modules/boxsizing.htc); }

body
{
    font-size: 14px;
	line-height: 1.4;
	text-align: left;
}

html, button, input, select, textarea
{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;		/* *** Tahoma vs Verdana as 1st fallback ??? Consider also which better as all-bold *** */
	font-weight: bold;													/* *** Need to actually put '700' here? Will this look bad when fallback font? Could use modernizer to check support and no-bold-if-gonna-fallback? *** */
	color: #343434;
}
button, input, select, textarea { color: #606060; }
a { color: inherit; } .lt-ie8 a { color: #FFF; }
td, th { padding: 5px; }
td, th { vertical-align: top; }
select[disabled] { color: #CCC; }

.lt-ie9 img[src$='.svg'] { filter: alpha(opacity=0); visibility: hidden; }

/* ---------- Typography ---------- */

.content, .panel_content { font-family: 'Open Sans', Tahoma, sans-serif; font-weight: normal; font-size: 0.9em; }

p  { margin: 0 0 1em 0; }
p:last-child { margin-bottom: 0; }

h1
{
	font-size: 1.75em;
	margin: 0.5em 0;
	text-transform: uppercase;
	/* color: #ca3028; */        /* Original Soapbox Design colour */
	color: #fff;}
h2
{
	margin: 0 0 0.83em 0;
	text-transform: uppercase;
	/* color: #ca3028; */        /* Original Soapbox Design colour */
	color: #fff;
}
h3
{
	margin-top: 0;
	text-transform: uppercase;
	color: #ca3028;
}

/* ---------- Framework ---------- */

.page_bound
{
	width: 960px;
	margin: 0 auto;
}

body
{
	background: #918474;
}

/* ---------- Top/Footer Navigation ---------- */

.top_nav
{
	background: #000;
	color: #FFF;
	text-align: right;
	padding: 10px 0;
}

.footer
{
	background-color: #052b35;
	background-color: rgba(0, 0, 0, 0.5);
	color: #FFF;
	text-align: right;
	padding-bottom: 1em;
}
	.lt-ie8 .footer { background-color: #052b35; }
	.ie8 .footer { background-color: transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#77000000,endColorstr=#77000000); zoom: 1; }
	.ie8 .footer > div { position: relative; }	/* [IE8 filter cleartype fix] */

.top_nav, .footer_nav
{
	text-align: right;
	font-size: 0.8em;
	text-transform: uppercase;
}
.footer_nav	{ padding: 10px 0; }

.top_nav ul, .footer_nav ul
{
	list-style: none;
	padding: 0;
	margin: 0;
}

.top_nav li, .footer_nav li
{
	display: inline;
	padding: 0 1em;
	border-right: 1px solid #FFF;
	white-space: nowrap;
}
.top_nav li:last-child, .footer_nav li:last-child { border-right: none; }

.top_nav a, .footer_nav a { text-decoration: none; }
.top_nav a:hover, .footer_nav a:hover { text-decoration: underline; }

.fine_print { font-size: 0.7em; }
.fine_print a { text-decoration: none; }
.fine_print a:hover { text-decoration: underline; }

/* ---------- Top Header ---------- */

.top_main
{
	background: #FFF;
	color: #000;
	padding: 1em 0;
	box-shadow: inset 0 -4px 9px -6px #000;
}

.top_logo
{
	float: left;
	width: 25%;
	padding-right: 15px;
}
.top_logo img { max-width: 100%; height: auto; }

.top_adh
{
	float: left;
	width: 75%;
}

/* ---------- Top Subheader ---------- */

.top_sub
{
	background-color: #052b35;
	background-color: rgba(0, 0, 0, 0.5);
	color: #FFF;
	border-top: 10px solid #ee2e23;
	padding: 10px 0;
}
	.lt-ie8 .top_sub { background-color: #052b35; }
	.ie8 .top_sub { background-color: transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#77000000,endColorstr=#77000000); zoom: 1; }
	.ie8 .top_sub > div { position: relative; }	/* [IE8 filter cleartype fix] */

.top_sub .panel { box-shadow: none; background-color: rgba(255, 255, 255, 0.2); }

/* ---------- Search ---------- */

.advsearch
{
	font-size: 1.1em;
	padding: 15px 60px;
}

.search select, .simple_search select, .advsearch select, .search input, .simple_search input, .advsearch input
{
	width: 12em;
	color: #606060;
	margin-right: 10px;
	padding: 4px 2px;
}
.search select[disabled], .simple_search select[disabled], .advsearch select[disabled] { color: #CCC; }
.advsearch select, .advsearch input { padding: 4px 10px; width: 13em; }
.search select.lite, .simple_search select.lite, .advsearch select.lite, .search input.lite, .simple_search input.lite, .advsearch input.lite, 
	.search .lite select, .simple_search .lite select, .advsearch .lite select, .search .lite input, .simple_search .lite input, .advsearch .lite input { width: auto; margin-right: 2px; }

.search ul, .simple_search ul, .advsearch ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	padding-bottom: 10px;
}
.advsearch ul { padding-bottom: 20px; }

.search li, .simple_search li, .advsearch li
{
	padding-top: 15px;
	display: block;
	position: relative;
	padding-left: 2em;								/* [nb. to create placeholder space for list item icons (plus pos:rel as icons will be absolutely positioned into this space)] */
}
.simple_search li { margin-right: 10px; display: inline-block; *display: inline; *zoom: 1; }
.advsearch li { padding-top: 25px; }

.search li ul, .advsearch li ul
{
	display: inline-block; *display: inline; *zoom: 1;
	padding: 0;
}

.search li li, .advsearch li li
{
	padding-top: 4px;
	display: inline-block; *display: inline; *zoom: 1;
	padding-left: 0;
}

.simple_search { text-align: center; }
.search_controls, .search_actions { text-align: center; }
.toggle_search_refine { display: none; }
.close_search_refine { padding-left: 10px; }

/* ---------- Enquire Form ---------- */

.enquire_form input, .enquire_form select, .enquire_form textarea { width: 100%; max-width: 15em; margin-bottom: 10px; }
.enquire_form label { width: 5em; display: inline-block; *display: inline; *zoom: 1; }
.enquire_form textarea { height: 6em; }
.enquire_goto { display: none; }
.enquire_actions { text-align: center; }
.enquire_message[data-show='Y'] { text-align: center; background: #cc2f28; padding: 4px; margin-bottom: 6px; }
.formreq { display: none; }

/* ---------- Listings ---------- */

.pagination
{
	padding: 5px;
	margin-bottom: 10px;
	background: #C8C8C8;
	background-color: rgba(255, 255, 255, 0.25);
	color: #47494c;
}
.pagination_bottom { margin-top: 10px; margin-bottom: 0; }
.pagination_info { float: left; }
.pagination_controls { float: right; padding-left: 5px; }

/* ---------- Listing Item ---------- */

.listing img, .listing_large img { max-width: 100%; height: auto; }

.listing_head
{
	background: #cc2f28;
	border-radius: 3px 3px 0 0;
	padding: 5px 10px;
}
.listing_head a { text-decoration: none; }

.listing_head.featured
{
	background: #cc2f28;
	color: #FFF;
	position: relative;
}

.listing_price
{
	float: right;
	padding-right: 50px;
}

.listing_body
{
	background: #FFF;
	color: #343434;
}

.listing_content { padding: 10px; }
.listing_bottom { margin-top: 1em; }
.listing_specs { padding: 10px 20px; }
.listing_specs table { margin: 0 auto; }
.listing_specs th { padding-right: 3em; text-align: left; }				/* [text-align left to fix IE8 behaviour of default !== 'inherit' thus it centers it which we dont want] */

	/* --- Small Listing Item Specifics --- */
	.listing { margin-bottom: 5px; }
	.listing .listing_content { padding-top: 0; }
	.listing .listing_imgs
	{
		float: left;
		width: 245px;
	}
	.listing .listing_imgs img { float: left; padding: 0 10px 10px 0; }
	.listing .listing_specs { float: left; }
	
	/* --- Large Listing Item Specifics --- */
	.listing_large { font-size: 1.2em; margin-bottom: 10px; }
	.listing_large .listing_head { padding: 8px 15px; }
	.listing_large .listing_price { padding-right: 0; }
	.listing_large .listing_specs { font-size: 0.9em; padding: 0 40px; }
	.listing_large .listing_specs table { margin: 0; }
	.listing_large .listing_imgs 	{ float: left; width: 38%; }
	.listing_large .listing_content { float: left; width: 62%; }

.featured_flag { display: none; }
.featured .featured_flag { display: block; position: absolute; right: 5px; top: 5px; }

/* ---------- Item Detail ---------- */

.detail_head
{
	background: #cc2f28;
	border-radius: 3px 3px 0 0;
	padding: 5px 10px;
	position: relative;
	font-size: 1.1em;
}

.detail_price
{
	float: right;
	padding-right: 50px;
}

.detail_body
{
	background: #FFF;
	color: #343434;
	padding: 10px;
}
.lt-ie8 .detail_body a { color: #343434; }

.detail_imgs	{ float: left; width: 50%; }
.detail_brief	{ float: left; width: 50%; padding-left: 10px; padding-right: 10px; }
.detail_specs	{ float: left; width: 100%; padding: 1em 0; }
.detail_descr	{ float: left; width: 100%; word-wrap: break-word; }
.detail_descr iframe { max-width: 100%; }

.detail_spec_table { float: left; width: 50%; padding-left: 10px; }
.detail_spec_table:first-child { padding-left: 0; }
.detail_spec_table table { width: 100%; }
.detail_spec_table tr { background-color: #dde2e5; }
.detail_spec_table tr:nth-child(even) { background-color: #f1f3f5; }
.detail_spec_table tr.even { background-color: #f1f3f5; }
.detail_spec_table th { padding-right: 3em; text-align: left; }				/* [text-align left to fix IE8 behaviour of default !== 'inherit' thus it centers it which we dont want] */
.detail_brief th { padding-right: 2em; text-align: left; }					/* [text-align left to fix IE8 behaviour of default !== 'inherit' thus it centers it which we dont want] */

.detail_imgs .img_slider
{
	width: 100%;
	max-width: 340px;
	height: auto;														/* [Only for no/pre-initialisation, afterwards its ignored. Here so in that scenario it overrides dodgy hardcoded height in plugin css] */
	margin: 0 auto;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}
.detail_imgs .img_slider.rsFullscreen { max-width: none; }													/* [We need to turn off our max-width setting when fullscreen is enabled] */
.img_slider > .rsImg { margin: 5px; float: none; display: inline-block; *display: inline; *zoom: 1; }		/* [Styles only ever applied for no/pre-initialisation, afterwards ignored. Purpose: Make look better in these scenarios] */

/* ---------- About Slider ---------- */

.about
{
	font-size: 1.5em;
	font-weight: normal;
}

	.swipe_controls
	{
		font-weight: bold;
		text-align: center;
		list-style: none;
		margin: 0;
		padding: 0;
		font-size: 0.8em;
		text-transform: uppercase;
	}
	.about .panel + .swipe_controls { margin-top: -9px; }

	.swipe_controls li
	{
		display: inline-block; *display: inline; *zoom: 1;
		margin: 1px;
		padding: 0;
		border: 1px solid #5C6A70;
		background-color: rgba(255, 255, 255, 0.1);
	}
	.swipe_controls li:hover, .swipe_controls li.active
	{
		/* color: #CA3028; */								/* Removed - 20140716 */
		color: #fff;										/* Added - 20140716 */
		background-color: rgba(255, 255, 255, 0.3);			/* Added - 20140716 */

	}

	.swipe_controls li a
	{
		display: block;
		padding: 4px 15px;
		text-decoration: none;
	}

/* --- [swipe.js] Slider Stuff --- */

.swipe
{
	overflow: hidden;
	visibility: hidden;
	position: relative;
	padding: 2px;							/* [To solve in-some-browsers seeing a tiny bit of the next slide at the edge of current one] */
}
.pre-swipe { visibility: visible; }

.swipe-wrap
{
	overflow: hidden;
	position: relative;
}

.swipe-wrap > div
{
	float: left;
	width: 100%;
	position: relative;
}
.pre-swipe .swipe-wrap > div { display: none; }						/* [Is this worth doing?] */
.pre-swipe .swipe-wrap > div:first-child { display: block; }

.no-js .swipe-wrap > div, .lt-ie8 .swipe-wrap > div { display: block; float: none; padding-bottom: 0.5em; }
.no-js .swipe_controls, .lt-ie8 .swipe_controls { display: none; }

/* ---------- Location ---------- */

.locations_display { position: relative; }
.new_location_list { float: left; width: 41%; }
.new_location_map { float: right; width: 57%; }
.new_location_select { margin-bottom: 10px; }
.new_location_item { padding: 10px; border-bottom: 1px solid #777; }
.new_location_item:last-child { border-bottom: none; }
.new_location_scroll											/* *** Browsers w/out scroll support? (eg. remove height rule, make map scroll with you..) *** */
{																/* *** And/or consider shadows or something to further indicate hidden content? *** */
	height: 315px;
	overflow-y: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch;
	background-color: #052b35;
	background-color: rgba(0, 0, 0, 0.5);
}
.fullview .new_location_scroll { height: auto; overflow-y: visible; }
	
	.lt-ie8 .new_location_scroll { background-color: #052b35; }
	.ie8 .new_location_scroll { background-color: transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#77000000,endColorstr=#77000000); zoom: 1; }
	.ie8 .new_location_scroll > div { position: relative; }	/* [IE8 filter cleartype fix] */

.new_location_map { position: relative; padding-bottom: 37%; height: 0; }
.new_location_map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.no-js .new_location_select { display: none; }
.no-js .new_location_list { float: none; width: 100%; }
.no-js .new_location_map { display: none; }
.no-js .new_location_scroll { height: auto; overflow-y: visible; }
.no-js .location_scroll_toggle { display: none; }

/* ---------- Common Constructs ---------- */

.big_red_button
{
	margin: 10px 0;
	padding: 5px 20px;
	border-radius: 3px;
	display: inline-block; *display: inline; *zoom: 1;
	font-size: 1.3em;
	color: #FFF;
	text-transform: uppercase;
	text-decoration: none;
	
	background-color: #ef3026;
	background-image: -webkit-linear-gradient(top, #f07872, #ee2e24);
	background-image:    -moz-linear-gradient(top, #f07872, #ee2e24);
	background-image:      -o-linear-gradient(top, #f07872, #ee2e24);
	background-image:         linear-gradient(to bottom, #f07872, #ee2e24);
}
.big_red_button:hover
{
	background-color: #bd0001;
	background-image: -webkit-linear-gradient(top, #f07872, #bd0001);
	background-image:    -moz-linear-gradient(top, #f07872, #bd0001);
	background-image:      -o-linear-gradient(top, #f07872, #bd0001);
	background-image:         linear-gradient(to bottom, #f07872, #bd0001);
}
.big_red_button:active
{
	background-color: #8b0001;
	background-image: -webkit-linear-gradient(top, #f07872, #8b0001);
	background-image:    -moz-linear-gradient(top, #f07872, #8b0001);
	background-image:      -o-linear-gradient(top, #f07872, #8b0001);
	background-image:         linear-gradient(to bottom, #f07872, #8b0001);
}
.simple_search .big_red_button { margin-left: 10px; margin-right: 10px; }

.red_button
{
	margin: 0;
	padding: 2px 12px;
	border-radius: 3px;
	display: inline-block; *display: inline; *zoom: 1;
	font-size: 1.1em;
	color: #FFF;
	text-transform: uppercase;
	text-decoration: none;
	
	background: #d02f27;
	background-image: -webkit-linear-gradient(top, #ee2e24, #cc2f27);
	background-image:    -moz-linear-gradient(top, #ee2e24, #cc2f27);
	background-image:      -o-linear-gradient(top, #ee2e24, #cc2f27);
	background-image:         linear-gradient(to bottom, #ee2e24, #cc2f27);
}
.red_button:hover
{
	background: #b3312a;
	background-image: -webkit-linear-gradient(top, #ee2e24, #b3312a);
	background-image:    -moz-linear-gradient(top, #ee2e24, #b3312a);
	background-image:      -o-linear-gradient(top, #ee2e24, #b3312a);
	background-image:         linear-gradient(to bottom, #ee2e24, #b3312a);
}
.red_button:active
{
	background: #8a2e29;
	background-image: -webkit-linear-gradient(top, #ee2e24, #8a2e29);
	background-image:    -moz-linear-gradient(top, #ee2e24, #8a2e29);
	background-image:      -o-linear-gradient(top, #ee2e24, #8a2e29);
	background-image:         linear-gradient(to bottom, #ee2e24, #8a2e29);
}

.arrow_over
{
	background-image: url(/framework/images/arrow_over.png);
	background-repeat: no-repeat;
	background-position: top right;
}
.lt-ie7 .arrow_over { background-image: none; }
.arrow_over_full
{
	background-image: url(/framework/images/arrow_over_full.png);
	background-repeat: no-repeat;
	background-position: top center;
}
.lt-ie7 .arrow_over_full { background-image: none; }

.nav_prev, .nav_next
{
	background: #404a49;
	color: #FFF;
	text-transform: uppercase;
	font-size: 0.9em;
	text-decoration: none;
	display: inline-block; *display: inline; *zoom: 1;
	padding: 1px 6px;
}
.nav_prev:before { content: ''; width: 0; height: 0; border-right: 5px solid #FFF; border-top: 5px solid transparent; border-bottom: 5px solid transparent; display: inline-block; *display: inline; *zoom: 1; margin-right: 3px; }
.nav_next:after  { content: ''; width: 0; height: 0; border-left: 5px solid #FFF; border-top: 5px solid transparent; border-bottom: 5px solid transparent; display: inline-block; *display: inline; *zoom: 1; margin-left: 3px; }
.nav_edge { background: #888; cursor: default; }

.not_loaded { position: relative; }
.not_loaded:after { content: ''; position: absolute; z-index: 2; top: 50%; left: 50%; margin-left: -16px; margin-top: -16px; width: 32px; height: 32px; background-image: url(/framework/images/loading.gif); background-repeat: no-repeat; }

.general_head
{
	background: #cc2f28;
	border-radius: 3px 3px 0 0;
	padding: 5px 10px;
	color: #FFF;
}

.page_actions { text-align: right; margin-bottom: 5px; }
.page_actions a { border-right: 1px solid #8c8c8c; padding: 0 10px; }
.page_actions a:last-child { border-right: none; padding-right: 0; }
.page_actions a:first-child { padding-left: 0; }

/* img icons */
.icon														/* [if only ever using this for search guys, move it up there (and poss name differently) instead] */
{
	text-align: center;
	position: absolute;
	width: 1.5em;
	height: 1.3em;
	left: 0;
	top: 20px;												/* [nb. apprx li padding top + form item padding top] */
}
.advsearch .icon { top: 30px; }

.icon img { height: 100%; width: auto; }									/* [Looks good by default; this for keeping it roughly matching font-size when user(etc?) change font-size] */
.no-svg .icon img { height: auto; max-height: 100%; width: auto; }			/* [when not gonna be using svg's, only want to be doing this for shrinking the image, not expanding] */

/* bg icons */
[class^='icon_'] { position: relative; padding-left: 2.5em; }
[class^='icon_']:before
{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 1.5em;
	height: 1.3em;
	background-repeat: no-repeat;
	background-position: center;
	/*background-size: contain;*/							/* [off while FF looks bad doing it] */
}
		.icon_year:before		{ background-image: url(/framework/images/icons/field_years.svg); }
.no-svg .icon_year:before		{ background-image: url(/framework/images/icons/field_years.png); content: ' '; background-size: auto auto; }		/* ['content' = IE8 hack force repaint; 'bgsize' = no svg so no stretching] */
		.icon_hours:before		{ background-image: url(/framework/images/icons/field_hours.svg); }
.no-svg .icon_hours:before		{ background-image: url(/framework/images/icons/field_hours.png); content: ' '; background-size: auto auto; }
		.icon_location:before	{ background-image: url(/framework/images/icons/field_location.svg); }
.no-svg .icon_location:before	{ background-image: url(/framework/images/icons/field_location.png); content: ' '; background-size: auto auto; }

/* search button */
.search_button:after
{
	content: '';
	display: inline-block; *display: inline; *zoom: 1;
	margin-left: 0.5em;
	width: 0.8em;
	height: 0.8em;
	background-image: url(/framework/images/icons/search.svg);
	background-repeat: no-repeat;
	background-position: center;
	/*background-size: contain;*/							/* [off while FF looks bad doing it] */
}
.no-svg .search_button:after { background-image: url(/framework/images/icons/search.png); content: ' '; background-size: auto auto; }				/* ['content' = IE8 hack force repaint; 'bgsize' = no svg so no stretching] */
.no-js .search_button { display: none; }

/* misc */
.no-js .form_submitter_link { display: none; }

.contentskyscraper_content
{
	float: left;
	width: 80%;
}
.grid_3_4 .contentskyscraper_content { width: 75%; }

.contentskyscraper_skyscraper
{
	float: left;
	width: 20%;
	padding-left: 20px;
}
.grid_3_4 .contentskyscraper_skyscraper { width: 25%; }

.no-js .nojsnoshow { display: none; }

.tcycle img { width: 100%; height: auto; }
.tcycle a { display: none; }
.tcycle a.first { display: inline; }

.lt-ie7 .top_adh .tcycle img { width: auto; }
.lt-ie7 .top_adh .tcycle { width: 720px; height: 110px; }

.lt-ie8 img { -ms-interpolation-mode: bicubic; }

/* ---------- Basic Grids ---------- */

.grid_1_2 { float: left; width: 49%; margin-left: 1%; }
.grid_1_4 { float: left; width: 24%; margin-left: 1%; }
.grid_3_4 { float: left; width: 75%; margin-left: 1%; }

[class*='grid_']:first-child { margin-left: 0; }
.lt-ie7 .grid_1_2 { width: 48%; }							/* [coverage for those not fixed by line above] */
.lt-ie7 .grid_3_4 { width: 74%; }

.panel
{
	background-color: #4f9cbb;
	background-color: rgba(255, 255, 255, 0.25);
	border-radius: 3px;										/* [NB. Box Shadow + Border Radius = significant performance bottleneck] */
	color: #FFF;
	box-shadow: 0 0 1em #343434;
	margin-top: 10px; margin-bottom: 10px;
}
	.lt-ie9 .panel { background-color: transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FFFFFF,endColorstr=#33FFFFFF); zoom: 1; }
	.lt-ie9 .panel > div { position: relative; }	/* [IE8 filter cleartype fix] */

.panel_body { padding: 10px; }
.panel_head
{
	border-radius: 3px 3px 0 0;
	background-color: #cc2f28;
	color: #FFF;
	padding: 10px 20px;
	font-size: 1.4em;
	text-transform: uppercase;
}

.panel_content { background: #FFF; color: #343434; padding: 10px; }
.lt-ie8 .panel_content a { color: #343434; }

.dark_panel_content
{
	padding: 10px;
	background-color: #052b35;
	background-color: rgba(0, 0, 0, 0.5);
}
	.lt-ie9 .dark_panel_content { background-color: transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#77000000,endColorstr=#77000000); zoom: 1; }
	.lt-ie9 .dark_panel_content > div { position: relative; }	/* [IE8 filter cleartype fix] */

.panel_border { border: 1px solid #5c6a70; }

.bgcover
{
	/*background: url(/framework/images/bg2.jpg) no-repeat top center #1d6a8a; */
	background-color:  #aaa; /*#1d6a8a; */
	-webkit-background-size: cover;
	background-size: cover;
}
.lt-ie9 .bgcover { background-attachment: fixed; }

/* ---------- Media Queries ---------- */					/* [Nb. For width based breakpoints, add 17px to desired BP point to cover browsers which do and don't include scrollbar in calculation] */

@media only screen and (max-width: 987px)
{
	.page_bound { width: 95%; }
	
	.grid_1_2, .grid_1_4, .grid_3_4
	{
		float: none;
		width: 100%;
		margin-left: 0;
	}

	.grid_3_4 .contentskyscraper_content    { width: 80%; }
	.grid_3_4 .contentskyscraper_skyscraper { width: 20%; }
	
	.toggle_search_refine { display: inline; }
	.search_refine { display: none; }
	.search_open .search_refine { display: block; }
	
	.advsearch { font-size: 1em; padding: 15px 30px; }
	
	/* --- For simplifying experience as it becomes less nescessary (and as performance becomes more important) --- */
	.panel
	{
		box-shadow: none;				/* [Starts being less noticable now that the panels are fullscreen anyway, so lets remove and reap the (significant) performance improvements] */
	}
	
	.enquire_goto { display: block; }
	.enquire_actions { text-align: left; }
}

@media only screen and (max-width: 730px)
{
	.contentskyscraper_content, .grid_3_4 .contentskyscraper_content { float: none; width: 100%; }
	.contentskyscraper_skyscraper, .grid_3_4 .contentskyscraper_skyscraper { display: none; }
	
	.advsearch { padding: 10px; }
	.advsearch select, .advsearch input { padding: 2px; width: 12em; }				/* [Not overriding the rules on the '.lite' guys of these cause their original rules above have > specificities than rules here; good!] */
	.advsearch li { padding-top: 15px; }
	.advsearch .icon { top: 20px; }
	
	.top_main { text-align: center; }
	.top_logo { float: none; width: 35%; margin: 0 auto; padding: 0; }
	.top_adh { display: none; }
	.top_nav { display: none; }
	.about { font-size: 1.3em; }
	
	/* --- For simplifying BG(related) experience as it becomes less nescessary (and as performance becomes more important) --- */		/* [Remove these to keep BG image w/ transparent panels regardless of screen size] */
	.footer
	{
		/* background: #052b35;  Edited - 20140716 at request of Matthew Hammond */
		background: #333;
	}
	
	.top_sub
	{
		/* background: #052b35;  Edited - 20140716 at request of Matthew Hammond */
		background: #333;
	}
	.panel
	{
		/* Edited - 20140716 at request of Matthew Hammond
		
		background: #4f9cbb;
		background-image: -webkit-linear-gradient(top, #4d92ad 1%,#59b7db 50%,#4d92ad 100%);
		background-image:    -moz-linear-gradient(top, #4d92ad 1%, #59b7db 50%, #4d92ad 100%);
		background-image:      -o-linear-gradient(top, #4d92ad 1%,#59b7db 50%,#4d92ad 100%);
		background-image:         linear-gradient(to bottom, #4d92ad 1%,#59b7db 50%,#4d92ad 100%); */
		
		background: #aaa;
		background-image: -webkit-linear-gradient(top, #999999 1%,#666666 50%,#b5b5b5 100%);
		background-image:    -moz-linear-gradient(top, #999999 1%, #666666 50%, #b5b5b5 100%);
		background-image:      -o-linear-gradient(top, #999999 1%,#666666 50%,#b5b5b5 100%);
		background-image:         linear-gradient(to bottom, #999999 1%,#666666 50%,#b5b5b5 100%);		
		
	}
	.bgcover
	{
		background-image: none;
		-webkit-background-size: auto;
		background-size: auto;
		/* background-color: #1d6a8a; */
		background-color: #666;
	}
	
	.detail_imgs	{ float: none; width: 100%; padding: 0; }
	.detail_brief	{ float: none; width: 100%; padding-top: 10px; }
	.detail_spec_table { float: none; width: 100%; padding: 0; }
	.detail_spec_table th { width: 30%; padding-right: 1em; }
	
	.new_location_list { float: none; width: 100%; }
	.new_location_map { display: none; }
	.new_location_scroll { height: auto; overflow-y: visible; }
	.location_scroll_toggle { display: none; }
	/*
	.livechat
	{
		display: none !important;	
	}*/
}

@media only screen and (max-width: 500px)
{
	.listing_large .listing_imgs 	{ float: none; width: 100%; text-align: center; }
	.listing_large .listing_content { float: none; width: 100%; }
	
	.rsFullscreenBtn { display: none !important; }
	
	.contact_form input, .contact_form select, .contact_form textarea { width: 100%; }
}

@media only screen and (max-width: 310px)
{
	.listing .listing_imgs { width: 100%; }
	.listing .listing_imgs img { padding: 5px; }
}

/* ---------- Helpers ---------- */

.contain:before, .contain:after { content: " "; display: table; }
.contain:after { clear: both; }
.contain { *zoom: 1; }

.position_base { position: relative; }
.hang_right { float: right; margin-left: 10px; margin-bottom: 10px; }
.hang_b_right { float: right; margin-left: 10px; }
.hang_left  { float: left; margin-right: 10px; }
.text_right { text-align: right; }
.center { text-align: center; }
.position_br { position: absolute; bottom: 0; right: 0; }
.text_left { text-align: left; }
.table_top { vertical-align: top; }
.keep_together { white-space: nowrap; }

/* -------------- Live Chat ---------------- */

.livechat_poweredby
{
	display: none !important;	
}