@import url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

:root {
	--color-interactive-green: hsl(154, 85%, 28%);
	--color-theme: #3a4f5f;
}

/* Important for footer at bottom */
html,
body {
	max-width: 100%;
	height: 100%;
	overflow-x: hidden;
}

.main-wrapper {
	position: relative;
	min-height: 100%;
	max-width: 100%;
	/* margin-bottom = same height as footer */
	padding-bottom: 30px;
	/* Same height as footer, plus space for screen "notches" */
	padding-bottom: calc(30px + env(safe-area-inset-bottom));
}

body {
	font-family: 'Poppins', sans-serif;
	background: #fbfbfb;
	font-size: 14px;
	overflow-y: scroll;
	text-decoration: none;
}

.main-content-link {
	background-color: var(--dark);
	color: white;
	text-align: center;
	border-radius: 0 0 5px 5px;
}
.main-content-link:focus {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	padding: 0.5em 1em;
	color: white;
	outline: none;
	z-index: 10;
}

/* header css */
/*noinspection CssReplaceWithShorthandSafely*/
.main-header {
	--darken-by: 0;
	--header-image-url: url(/assets/image/v2/bg-header.gif);
 	/* fallback for older browsers */
 	background: #3a4f5f url(/assets/image/v2/bg-header.gif) repeat-x;
 	
	background:
		linear-gradient(
			rgba(0, 0, 0, var(--darken-by)),
			rgba(0, 0, 0, var(--darken-by))
		) no-repeat 0 0,
		var(--header-image-url) -300px 0 repeat-x;
	background-color: #3a4f5f;
	color: #fff;
	padding: 0 1rem;
}

@supports (width: max(1rem, 2rem)) {
	.main-header {
		padding-left: max(1rem, env(safe-area-inset-left));
		padding-right: max(1rem, env(safe-area-inset-right));
	}
}

.main-footer {
	display: flex;
	position: absolute;
	height: 30px;
	/* Add space for screen "notches" or OS elements */
	height: calc(30px + env(safe-area-inset-bottom));
	padding-bottom: env(safe-area-inset-bottom);
	bottom: 0;
	left: 0;
	right: 0;
	align-items: center;
	box-sizing: border-box;
	background: hsl(205, 26%, 25%) linear-gradient(to bottom, hsl(205, 26%, 37%), hsl(205, 26%, 25%));
	border-top: 1px solid #445f70;
	text-align: center;
	overflow: visible;
}

.copyright {
	margin: 0 auto;
	font-size: 12px;
	color: white;
}
.copyright > a {
	color: inherit;
	text-decoration: underline;
}

#main {
	padding-bottom: env(safe-area-inset-bottom);
}

.page--userweb #main {
	padding-left: env(safe-area-inset-left);
	padding-right: env(safe-area-inset-right);
}

.page--userweb table {
	max-width: 100%;
}

.login-btn {
	margin: .5rem 0;
	background: linear-gradient(#fcb35d, #de8317);
	border: #d47300;
	color: #333;
	font-weight: 600;
	text-shadow: none;
}

.focus,
.btn.focus,
.btn:focus {
	box-shadow: 0 0 0 .2rem rgba(255, 123, 0, .5);
	outline: none;
}

/* For browsers that support focus-visible */
:focus-visible {
	box-shadow: 0 0 0 .2rem rgba(255, 123, 0, .5);
	outline: none;
}

/* For Firefox */
:-moz-focusring {
	box-shadow: 0 0 0 .2rem rgba(255, 123, 0, .5);
	outline: none;
}

.header-bottom-border {
	border-bottom: 3px solid;
}

/* Expand past padding from parent */
.navbar-collapse {
	margin: 0 -1rem;
}

/* Match header's padding */
.navbar-nav {
	padding: 0.5rem 1rem 1rem;
}

.rentals__tablist {
	float: left;
	position: relative;
	z-index: 10;
}

.main-header .navbar-nav .nav-link {
	color: #fff;
	text-shadow: 0 0 10px rgba(0, 0, 0, 1);
}

/* end of  header css */

/* tab and filter css */
.tab-filter-header .nav-tabs .nav-link {
	color: #fff;
	padding: .1rem .85rem;
	border-radius: 50px;
	margin-right: .5rem }

.tab-filter-header .nav-tabs .nav-link.active {
	color: #000;
	border-radius: 20px;
}

.filters {
	background: #fff;
}

.filters__toggle {
	position: relative;
	z-index: 200;
	background-color: rgba(255, 255, 255, 0.13);
	text-decoration: none;
}

.filters__toggle::after {
	transition: transform 500ms;
	transform: rotate(-90deg);
}

.filters__toggle.is-open::after {
	transform: rotate(0);
}

.filters__container {
	position: relative;
	z-index: 100;
}

.filters__actions {
	position: relative;
	display: flex;
	justify-content: flex-start;
}

.filters.has-js .filters__submit {
	display: none;
}

.filters__save {
	order: -100;
}

.filters__status {
	margin: auto;
	text-align: center;
}

.status__icon {
	display: none;
	font-style: normal;
	animation: 0.5s infinite alternate forwards fade-in;
}


.status__icon--active {color: grey}

.status__icon--error {color: red}

.status__icon--complete {
	color: green;
	animation-iteration-count: 1;
}

.t-active .status__icon--active,
.t-error .status__icon--error,
.t-complete .status__icon--complete {display: initial}

@keyframes fade-in {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@supports (padding-bottom: max(0)) {
	.filters__footer {
		padding-bottom: max(0.5rem, env(safe-area-inset-bottom))
	}
}

.filters__reset {
	display: none;
}

.filters__shade {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	background: rgba(251, 251, 251, .9) url(/assets/image/loading.gif) no-repeat scroll center 150px;
	display: none;
}

/* end of tab and filter css */

.listings__listing {
	/* Fix content sticking out past rounded corners */
	overflow: hidden;
}

.dropdown-menu-form.show {
	display: block !important;
}

/* property list details section */
.property-details--counter .details-counter-blocks {
	border-right: 2px solid #fff;
	text-align: center;
}

.property-details--counter .details-counter-blocks:last-child {
	border: none;
}

.property-name-heading {
	font-size: 1.4rem;
}

.property-list--details-text {
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	position: relative;
	overflow: hidden;
	-webkit-box-orient: vertical;
	display: -webkit-box;
}

.property-details--pricing__height {
	height: calc(100% - 52px);
}

.property-details__description p:last-child {
	margin-bottom: 1rem;
}

@media (min-width: 768px) {
	.property-details__description p:last-child {
		margin-bottom: 0;
	}
}

/* end of property list details section */

/*******************************************************************************
 * Forms
 ******************************************************************************/
.form-control.t-subtle {
	border-radius: 0;
	border: 1px #C6C9CC;
	border-style: none none solid none;
	padding-left: 0;
	padding-right: 0;
	background: transparent;
}
.t-subtle[disabled] {
	background-color: var(--light);
	padding-inline: .5rem;
	cursor: not-allowed;
}

.form-control.t-subtle.is-invalid {
	border-color: #dc3545;
}

.form-control.t-subtle:focus {
	border-color: #80bdff;
	box-shadow: 0 4px 2px -2px rgba(0, 123, 255, .25);
}

/* custom classes for buttons, text, background form */
.button__green {
	background: var(--color-interactive-green);
	color: #fff;
	transition: box-shadow 0.1s;
}

.button__green:not(:disabled):hover {
	color: white;
	box-shadow: .1rem .1rem .1rem .1rem rgba(0, 0, 0, 0.5);
}

.button__green.outline {
	border: 1px solid var(--color-interactive-green);
	color: var(--color-interactive-green);
	background: #fff;
}

.button__green.outline:not(:disabled):hover {
	color: var(--color-interactive-green);
}

.button__grey {
	background: #ccc;
	color: #000000;
	transition: box-shadow 0.1s;
	border:solid 1px #ccc;
}

.button__grey:not(:disabled):hover {
	box-shadow: .1rem .1rem .1rem .1rem rgba(0, 0, 0, 0.5);
}

.button__grey.outline {
	border: 1px solid var(--color-interactive-green);
	color: var(--color-interactive-green);
}

.button__grey.outline:not(:disabled):hover {
	color: #ccc;
}

.text-blue {
	color: #1a3d70;
}

.rounded-capsule {
	border-radius: 80px;
}

.shadow-sm {
	box-shadow: 0 .125rem .3rem rgba(0, 0, 0, .085) !important}

.custom-checkbox .custom-control-label::before {
	background: #fff;
	border: 2px solid #a4a4a4;
	border-radius: 3px;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
	background-color: #fff;
	border: 2px solid var(--color-interactive-green);
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
	background: none;
	content: "\f00c";
	font-family: 'fontawesome';
	top: 3px;
	left: 2px;
	color: var(--color-interactive-green);
	font-size: 13px;
}

/* end of custom classes for buttons, text, background */

/* stepbar widget */
.stepbar-form .nav-link i {
	font-size: 1.2rem;
}

.stepbar-form .nav-link.active i {
	color: #1a3d70 !important;
}

/* end of stepbar widget */

.navbar-brand > img {max-width: 150px;}

#colorbox:focus {
	box-shadow: none;
}

@media screen and (min-width: 375px) {
	.filters__reset {
		display: initial;
	}
}

@media (max-width: 575px) {
	.tab-filter-header .nav-tabs .nav-link {
		padding: .1rem .65rem;
		margin: .3rem 0;
	}

	.full-width-sm {
		width: 100%;
	}

	.navbar-collapse {
		background: #3a4f5f;
	}

	.green .main-header .navbar-collapse {background-color: #2b5b37}

	.breeze .main-header .navbar-collapse {background-color: #285658}

	.orange .main-header .navbar-collapse {background-color: #a29784}

	.gray .main-header .navbar-collapse {background-color: #333}
}

@media (min-width: 576px) {
	.main-header {
		--darken-by: 0.1;
		background-position-x: 0, calc(50% + 170px)
	}

	.login-btn {
		margin: 0 0 0 .5rem;
	}

	.tab-filter-header .nav-tabs .nav-link {
		padding: .1rem .65rem;
	}

	.navbar-nav .nav-item.nav-link,
	.navbar-nav .nav-item > .nav-link {
		padding: 0.5rem;
	}

	.navbar-nav {
		margin: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
}

@media (min-width: 768px) {
	body {
		font-size: 16px;
	}

	.main-header {
		background-position-x: 0, calc(50% + 86px)
	}

	.navbar-brand > img {max-width: none; max-height: 86px }

	.navbar-nav .nav-item.nav-link,
	.navbar-nav .nav-item > .nav-link {
		padding: 0.5rem 0.8rem;
	}
}

@media (min-width: 992px) {
	.property-list--details-text {
		text-overflow: ellipsis;
		-webkit-line-clamp: 4;
		position: relative;
		overflow: hidden;
		-webkit-box-orient: vertical;
		display: -webkit-box;
	}

	.property-details--counter .details-counter-blocks {
		border-bottom: 2px solid #fff;
		border-right: none;
		text-align: left;
	}

	.property-details--counter .details-counter-blocks:last-child {
		border: none;
	}

	.stepbar-form .nav-item::before {
		position: absolute;
		content: '';
		border-bottom: 1px solid #ccc;
		left: 10px;
		width: 85%;
		top: 49%;
		z-index: -1;
	}

	.stepbar-form .nav-link {
		display: inline-block;
		background: #fbfbfb;
	}

	.main-header {
		background-position-x: 0, calc(50% - 26px);
	}
}

@media (min-width: 1200px) {
	.main-header {
		background-position-x: 0, calc(50% - 130px);
	}
}

/*******************************************************************************
 * Themes
 ******************************************************************************/
.orange {
	background: hsl(40, 46%, 97.5%);
}

.green {
	background: hsl(140, 23%, 97.5%);
}

.gray {
	background: hsl(0, 8%, 97.5%);
}

.breeze .main-header {
	--header-image-url: url(/assets/image/v2/bg-header-breeze.gif);
	background-color: #285658
}

.gray .main-header {
	--header-image-url: url(/assets/image/v2/bg-header-gray.gif);
	background-color: #5c5c5c;
}

.green .main-header {
	--header-image-url: url(/assets/image/v2/bg-header-green.gif);
	background-color: #3e6749;
}

.orange .main-header {
	--header-image-url: url(/assets/image/v2/bg-header-orange.gif);
	background-color: hsl(36.9, 23.6%, 78.4%);
}

.bg-theme { background-color: var(--color-theme);}

.breeze { --color-theme: #285658 }
.gray { --color-theme: #333 }
.green { --color-theme: #2b5b37 }
.orange { --color-theme: hsl(38, 14%, 36.5%) }


.breeze .main-footer {
	background: #366263 linear-gradient(to bottom, hsl(181, 29.4%, 37%), hsl(181, 29.4%, 25%));
	border-top-color: #366263;
}

.gray .main-footer {
	background: #848484 linear-gradient(to bottom, hsl(0, 0%, 37%), hsl(0, 0%, 25%));
	border-top-color: #595959;
}

.green .main-footer {
	background: #6d9b77 linear-gradient(to bottom, hsl(133, 29%, 37%), hsl(133, 29%, 25%));
	border-top-color: #426e4b;
}

.orange .main-footer {
	background: #eadece linear-gradient(to bottom, #eadece, #bab3a6);
	border-top-color: #ccc0b0;
}

/* fair housing logo to go in footer */
.footer-eha-logo {
	background: url(/assets/image/equal-housing-white-30h.png) repeat-x;
	background-size: contain;
	height:18px;
	width:21px;
	display:inline-block;
	margin-bottom:-2px;
	margin-left:25px;
}
.orange .footer-eha-logo {
	background: url(/assets/image/equal-housing-30h.png) repeat-x;
	background-size: contain;
}

.orange .copyright {color: #1c1c1c}

.navbar-toggler {
	border: none;
	color: white;
	background: rgba(0, 0, 0, 0.25)
}

body:not(.default) .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
/*******************************************************************************
 * Colorbox
 ******************************************************************************/
button#cboxNext {
	margin-left: 15px;
}
div#cboxCurrent {
	margin-left: 25px;
}
