.search-line {
	display: flex;
	flex-direction: row;
	margin-top: 24px;
	padding: 8px 8px 8px 24px;
	border-radius: 32px;
	width: 533px;
	justify-content: space-between;
	background-color: #ffffff;
	box-shadow: 0px 3px 12px 0px #2540861a;
	padding: 8px 8px 8px 24px;
}

.search-line input {
	flex-grow: 1;
	border: none;
	outline: none;
	border: none;
}

.search-line button {
	flex-shrink: 0;
	display: flex;
	border-radius: 20px;
	height: 40px;
	width: 40px;
	border: none;
	background-image: url(/static/coral/img/icon_search.svg);
	background-size: cover;
}

@media ( max-width : 767px) {
	.search-line {
		width: 100%;
	}
}

.bg-success {
	background-color: #f8fef7
}

.bg-dabger {
	background-color: #fef7f8
}

.card {
	display: flex;
}

.card-left {
	flex-shrink: 0;
	width: 200px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.card-right {
	margin-left: 48px;
	flex-grow: 1;
}

.card-photo {
	width: 200px;
	height: 200px;
	border-radius: 16px;
	background-position: center;
	background-size: cover;
}

@media ( max-width : 1199px) {
	.card-left {
		width: 175px;
	}
	.card-photo {
		width: 175px;
		height: 175px;
	}
	.card-right {
		margin-left: 24px;
	}
}

@media ( max-width : 991px) {
	.card-left {
		width: 150px;
	}
	.card-photo {
		width: 150px;
		height: 150px;
	}
	.card-right {
		margin-left: 36px;
	}
}

@media ( max-width : 767px) {
	.card {
		flex-direction: column;
		align-items: center;
	}
	.card-left {
		width: 100%;
	}
	.card-right {
		margin-top: 24px;
		margin-left: 0px;
	}
}

@media ( max-width : 767px) {
	.card-photo {
		max-width: 100%;
	}
	.landing section h2 {
		margin-bottom: 16px;
	}
}

.card-status {
	margin-top: 16px;
	display: block;
	font-size: 14px;
	color: #df6b7c;
	background-color: #fef7f8;
	padding: 4px 12px 6px;
	text-align: center;
	border-radius: 11px;
}

.card-info {
	display: table;
}

.card-row {
	display: table-row;
}

.card-name, .card-value {
	padding-top: 6px;
	display: table-cell;
}

.card-value {
	padding-left: 24px;
}

@media ( max-width : 767px) {
	.card-value {
		padding-left: 12px;
	}
}

/** search page boxes */
.search-block {
	margin-top: 48px;
	display: flex;
}

.search-filters {
	flex-shrink: 0;
	margin: 0 80px 0 0;
	width: 240px;
}

.search-result {
	flex-grow: 1;
	max-width: 720px;
}

@media ( max-width : 1199px) {
	.search-filters {
		margin: 0 48px 0 0;
		width: 220px;
	}
}

@media ( max-width : 991px) {
	.search-filters {
		margin: 0 32px 0 0;
		width: 200px;
	}
}

@media ( max-width : 767px) {
	.search-block {
		margin-top: 24px;
		display: block;
	}
	.search-filters {
		width: 100%;
		margin: 0 0 48px 0;
	}
	.search-result {
		max-width: none;
	}
}

/** card link */
.card {
	position: relative;
}

.card-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 5;
}

/** city filter */
.places-box {
	display: flex;
	position: relative;
	width: 100%;
}

.places-list {
	background-color: #ffffff;
	position: absolute;
	width: calc(100% - 2px);
	min-height: 50px;
	border-left: 1px solid #25408614;
	border-right: 1px solid #25408614;
	border-bottom: 1px solid #25408614;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	z-index: 10;
}

.places-list button:not(:last-child) {
	border-bottom: 1px solid #25408614;
}

.places-list button:last-child {
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.btn-city {
	display: flex;
	width: 100%;
	border: none;
	background-color: #ffffff;
	padding: 10px 5px;
	font-size: 16px;
}

.places-list span {
	display: flex;
	padding: 10px 5px;
}

/** paginator */
.paginator {
	margin-top: 48px;
	display: flex;
	flex-direction: row;
	gap: 21px;
	justify-content: center;
	display: flex;
}

.btn-page {
	color: #df6b7c;
	background-color: transparent;
	border: none;
	font-weight: bold;
}

.btn-page-active {
	background-color: #df6b7c;
	width: 32px;
	height: 32px;
	border-radius: 16px;
	color: #ffffff;
}

.btn-page-empty {
	cursor: default;
}