.modal__filter {
	width: 100%;
	background-color: var(--color-white);
	position: absolute;
	z-index: 2;
	overflow: auto;
	/* height: calc(100vh - 114px); */
	height: calc(100vh - 175px);
	/* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); */
	box-shadow: 0 -3px 12px rgb(0 0 0 / 10%);
	/* top: 7.1rem; */
	/* top: 11.9rem; */
	/* top: 4.5rem; */
	/* top: 3.8rem; */
	top: 4.45em;
	left: 0;
	display: flex;
}

.modal__filter.active {
	display: block;
	flex-direction: column;
	justify-content: space-between;
}

.modal__background {
	display: none;
	position: fixed;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.modal__background.active {
	display: block;
}

.modal__background--primary {
	background-color: var(--color-primary--transparent);
}

.modal__background--black {
	background-color: var(--color-black--transparent);
}

.modal--only-mobile {}

.modal__background--only-desktop {
	position: static;
	height: auto;
	top: auto;
}

.modal__background--only-desktop .modal__button-close {
	display: none;
}

.modal__button-close {
	position: relative;
	font-size: 16px;
	/* padding: 8px 8px 6px 8px; */
	padding: 8px 10px 6px 10px;
	z-index: 3;
}

.modal__close-button {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	padding: 0 2rem;
	padding-top: 2rem;
}

.modal__close-button .button {
	color: white;
}

.modal__filter__container {
	padding: 0rem 1rem;
	margin-bottom: 200px;
}

.modal__filter__header,
.modal__filter__footer {
	padding: 0.8rem 1.5rem;
	z-index: 2;
}

.modal__filter__header {
	background-color: var(--color-white);
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: sticky;
	top: 0;
	border-bottom: 1px solid var(--color-gray100);
	padding: 0.8rem 1.5em;
	/* margin: 0 1.5rem; */
}

.modal__filter__header .modal__filter__title {
	margin: 0;
	font-size: 18px;
	/* font-family: 'GillSans' !important; */
	/* font-family: var(--font__book) !important; */
	color: var(--color-gray700);

}
.button--showprojects{
	float: right!important;
	max-width: 200px!important;
}
.modal__filter__footer {
	/* justify-content: space-between; */
	justify-content: center;
	align-items: center;
	background-color: var(--color-white);
	/* position: sticky;
	bottom: 0; */
	box-shadow: 0 -1px 10px rgb(0 0 0 / 10%);
	padding: 1.5rem;
	position: fixed;
	/* bottom: 0; */
	bottom: -2px;
	width: 100%;
}




.filter__buttons {
	/* display: flex;
	justify-content: space-between; */
	/* display: grid;
	grid-template-areas: 
	"filter order"
	"tags tags"; */
	/* display: flex;
	justify-content: flex-end; */
	display: grid;
	justify-content: flex-end;
	grid-template-columns: auto auto;
	/* gap: 1rem; */
	/* margin-bottom: calc(40px - 1rem); */
	margin-bottom: 1rem;
	align-items: center;
	/* background: var(--color-gray100); */
	padding-top: 1rem;
	padding-bottom: 1rem;
}

.filter__buttons--container {
	position: sticky;
	/* top: 7rem; */
	/* top: var(--navbar-height); */
	top: 116px;
	z-index: 1;
	background: var(--background-body);
}

#openFilterModal {
	grid-area: filter;

}

#tags {
	grid-area: tags;
}

#openOrderModal {
	grid-area: order;
	justify-self: flex-end;
}



/* FORM */

form {
	--border-radio: 0.5rem;
	--box-y-padding: 0.6rem;
	--input-color: var(--color-gray400);

}

.form__filedset {
	/* padding: 1rem 1.5rem; */
	padding: 1rem 0;
	margin: 0;
}

input[type=checkbox].form__input,
input[type=checkbox].form__input--box,
input[type=radio].form__input--radio,
input[type=radio].form__input--box {
	display: none;
}

.form__spacer {
	display: grid;
}

.form__spacer--two-columns {
	grid-template-columns: 1fr 1fr;
	align-items: center;
}

.form__spacer--three-columns {
	grid-template-columns: 1fr 1fr 1fr;
}

.form__title,
.form__subtitle {
	margin: 0;
}

.form__input {
	display: block;
	/* font-family: 'GillSans', sans-serif; */
	/* font-family: var(--font__book) !important; */
}

form .form__input--text {
	display: flex;
	align-items: center;
	border-radius: var(--border-radio);
	border: 1px solid var(--color-gray300);
	padding: var(--box-y-padding) .6rem;
	background-color: var(--color-white);
	font-size: 14px;
	/* max-height: 42px; */
	max-height: 35px;
}

form .form__input--simple {
	width: 100%;
	padding: 0;
	border: 0;
	background-color: transparent;
}

form .form__input::placeholder {
	color: var(--color-gray200);
	font-size: 14px;
}

.form__container {
	margin: 0 auto;
}

.form__select-selected {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.form__select-selected.active {}

.form__select-selected span {
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 20px;
}

.form__select-selected::after {
	content: '\e902';
	font-family: 'icomoon';
	color: red;
	font-weight: lighter;
	/* padding: 0 2em; */
}

.form__select-options {
	display: none;
	color: var(--color-gray500);
}

.form__select-options.active {
	display: block;
}

.form__select-selected,
.form__select-option {
	padding: 1rem;
	border-bottom: 1px solid var(--color-gray100);
	color: var(--color-gray500);
	background-color: var(--color-white);
}

.form__select-selected:hover,
.form__select-option:hover,
.form__select-selected.active {
	background: var(--color-primary);
	color: var(--color-white);
	cursor: pointer;
}

.form__select-selected.active::after,
.form__select-selected:hover::after {
	color: var(--color-white);
}

.form__select-selected.active::after {
	content: '\e903';
}

.form__select-option--checkbox:hover {
	background-color: var(--color-white);
	cursor: normal;
}

.form__range {
	position: relative;
	margin-top: 1rem;
}

.form__input--checkbox {}

.form__input--text {}

.form__range-track {
	position: absolute;
	width: 100%;
	height: 3px;
	background-color: var(--color-gray300);
	border-radius: 5px;
}

.form__range-progress {
	position: absolute;
	height: 3px;
	border-radius: 5px;
	background-color: var(--color-primary);
	right: 0;
	left: 0;
}

.form__input--range {
	width: 100%;
	height: 3px;
	position: absolute;
	bottom: 3px;
	background: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	outline: none;
	pointer-events: none;
	z-index: 1;
}

.form__input--range::-webkit-slider-runnable-track {
	-webkit-appearance: none;
	height: 3px;
}

.form__input--range::-moz-range-track {
	-moz-appearance: none;
	height: 3px;
}

.form__input--range::-ms-track {
	appearance: none;
	height: 3px;
}


.form__input--range::-webkit-slider-thumb {
	-webkit-appearance: none;
	height: 15px;
	width: 15px;
	border-radius: 50%;
	border: 3px solid var(--color-primary);
	background-color: var(--color-white);
	cursor: pointer;
	pointer-events: auto;
}

.form__input--range::-moz-range-thumb {
	-webkit-appearance: none;
	height: 15px;
	width: 15px;
	border-radius: 50%;
	border: 3px solid var(--color-primary);
	background-color: var(--color-white);
	cursor: pointer;
	pointer-events: auto;
}

.form__input--range::-ms-thumb {
	appearance: none;
	height: 15px;
	width: 15px;
	border-radius: 50%;
	border: 3px solid var(--color-primary);
	background-color: var(--color-white);
	cursor: pointer;
	pointer-events: auto;
}

.form__label {
	color: var(--color-gray700);
}

.form__label--placeholder {
	display: inline-block;
	font-size: 14px;
	color: var(--color-gray200);
	white-space: nowrap;
	letter-spacing: 0;
}

.form__label--subtitle {
	color: var(--input-color);
	font-size: 14px;
	padding: 0 .9em;
}

.form__label--radio,
.form__label--checkbox {
	display: flex;
	align-items: center;
}

.form__label--radio {
	font-size: 16px;
	color: var(--color-gray500);
	margin: 0;
}

.form__label--radio::before,
.form__label--checkbox::before {
	content: '';
	display: block;
	width: 22px;
	height: 22px;
	border: 1px solid var(--color-primary);
	border-radius: 3px;
	margin-right: .6rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

.form__label--radio::before {
	width: 22px;
	height: 22px;
	margin-right: 1rem;
	border-radius: 50px;
	/* outline: 2px solid var(--color-primary); */
	border: 1px solid var(--color-primary);
}

.form__label--box {
	color: var(--input-color);
	padding: var(--box-y-padding) 1rem;
	border: 1px solid var(--color-gray300);
	border-radius: var(--border-radio);
	cursor: pointer;
	margin-bottom: 1rem;
	display: inline-block;
}

.form__label--box--lg {
	padding: var(--box-y-padding) 1.5rem;
}

.form__boxes {}

.form__boxes--flexible {
	/* display: flex;
	justify-content: space-between; */
	display: block;
	grid-template-columns: auto auto auto;
	gap: .5rem;
}

.form__boxes--grid {

}
.options div {
    display: inline-block;
}
.options input[type=checkbox] {
	display: inline-block;
	float: left;
    margin-top: 8px;
}
.options .form__label {
	padding-left: 9px
}

.form__input--radio:checked+.form__label--radio::before, .form__input--checkbox:checked+.form__label--checkbox::before, .form__input--box:checked+.form__label--box{
	background-color: var(--color-primary);
	color: var(--color-white);
	border-color: var(--color-primary);
}

.counterPlusAndMinus div{
	float: left;
	text-align: center;
	color: #9f9f9f!important;
	margin-left: 10px;
	margin: 20px 5px 0;
}

.plus, .minus{
    border: 1px solid #9f9f9f;
    width: 26px;
    height: 26px;
    border-radius: 13px;
    text-align: center;
    line-height: 24px;
    font-weight: 100;
    cursor: pointer;
	
}
.minus {
	line-height: 21px;
}
.fom__boxes--cuotes {
	justify-content: center;
	gap: 12px;
}

.fom__boxes--cuotes .form__label {
	width: 92%;
	height: 35px;
	font-size: 14px;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 1;
	margin: 0;
    margin-left: 4%;
}
.form__box{
	display: inline-block;
	width: 32%;
}


.form__label--checkbox:hover::before,
.form__label--radio:hover::after {
	cursor: pointer;
}

.form__input--radio:checked+.form__label--radio::before,
.form__label--radio:hover::before {
	background-color: var(--color-primary);
	border: 3px solid var(--color-white);
	/* outline: 2px solid var(--color-primary); */
	box-shadow: 0 0 0 1px var(--color-primary);
}

.form__input--checkbox:checked+.form__label--checkbox::before {
	content: '\e900';
	font-family: 'icomoon';
}

.form__label--range {
	margin-bottom: 1.2rem;
}



/* SELECTABLE */

.selectable {
	display: flex;
	background-color: var(--color-white);
	border-radius: var(--border-radio);
	overflow: hidden;
	/* justify-content: center;
	margin: 0 auto; */
}

.selectable__option {
	width: 100%;
}

.selectable__option:first-child>.selectable__name {
	border-top-left-radius: var(--border-radio);
	border-bottom-left-radius: var(--border-radio);
}

.selectable__option:last-child>.selectable__name {
	border-right: 1px solid var(--color-gray300);
	border-top-right-radius: var(--border-radio);
	border-bottom-right-radius: var(--border-radio);
}

.selectable__name {
	display: flex;
	min-width: 4em;
	padding: var(--box-y-padding) 1em;
	border: 1px solid var(--color-gray300);
	text-align: center;
	cursor: pointer;
	/* color: var(--color-gray700); */
	color: var(--input-color);
	margin: 0;
	height: 35px;
	align-items: center;
	justify-content: center;
    max-width: 90%;
	border-radius: 10px;
}

.selectable__input {
	display: none;
}

.selectable__input:checked+.selectable__name {
	background-color: var(--color-primary);
	border: 1px solid var(--color-primary);
	color: white;
}

#clearFilter{ 
	display: inline-block!important
}

@media (min-width:768px) {}


@media (min-width:998px) {


	.filter__buttons {
		/* background-color: transparent; */
		grid-template-areas: "filter tags order";
		grid-template-columns: auto auto auto;
	}

	.form__label--radio{
		font-size: 14px;
	}

	.modal__background--only-mobile {
		background: transparent;
		position: absolute;
		height: auto;
		top: 5rem;
		right: 20px;
		left: auto;
		width: auto;
	}

	.modal__background--only-desktop {
		position: fixed;
		height: 100vh;
		top: 0;
		z-index: 101;
	}

	.modal__background--only-desktop .modal__button-close {
		display: inline-block;
	}

	.modal__button-close {
		
	}

	.modal__filter {
		position: relative;
		max-width: 40%;
		border-radius: 15px;
		height: 100%;
		top: auto;
		bottom: auto;
		float: right;
	}

	.modal__filter__footer {
		position: sticky;
	}

	.modal__filter__container {
		margin-bottom: 0;
	}

}


@media (min-width:1100px) {
	.modal__background--only-mobile {
		right: 0;
	}

	/* .filter__buttons--container {
		top: 70px;
	} */
}

@media (max-width: 768px) {
	.map {
		width: 100%;
	}
	.projects {
		float: left;
		width: 100% !important;
		padding: 0 20px;
		height: auto;
		overflow: initial;
		margin-bottom: 40px;
		margin-top: 20px;
	}
	.map .project-card {
		max-width: 283px!important;
		width: 100%;
	}
	.gm-style .gm-style-iw-c{
		max-width:283px!important
	}
}