.page {
    display: flex;
}
.content {
    margin: 90px 0 10px 0;
}
.mapResult {
    height: calc(100vh - 30px);
    border-radius: var(--border-radius-one);
	position: fixed;
    right: 15px;
	margin-left: 15px;
	overflow: hidden;
	box-shadow: 1px 1px 5px 0px #c3c3c3;
}
.filters .mapToggle {
	display: none;
}
.filters .mapToggle .form {
    display: flex;
    justify-content: space-between;
    font-size: 15px;
}
.filters .mapToggle .form > div {
    text-align: center;
    width: 100%;
	height: 50px;
    padding: 10px 20px;
    cursor: pointer;
    background: #fffffd;
    border-right: 1px solid #eeeeeb;
}
.filters .mapToggle .form > div:first-child {
    border-radius: 4px 0 0 4px;
}
.filters .mapToggle .form > div:last-child {
    border-radius: 0 4px 4px 0;
    border: none;
}
.filters .mapToggle .form > div > div {
	border-bottom: 4px solid #eeeeeb;
	padding: 0 0 5px 0;
}
.filters .mapToggle .form > div.active > div {
    border-bottom: 4px solid #ff5722;
}
.dir-filters {
    padding: 5px;
	margin-top: 0;
}
.dir-filters .button {
    width: 100%;
}
.dir-filters .hotelDirection, 
.dir-filters .hotelGuest,
.dir-filters .activeDateDepart,
.dir-filters .activeNumberTourists {
	max-width: 100%;
}
.dir-filters .formSearchButtons {
    border: none;
    padding: 0;
    display: block;
    margin-bottom: 15px;
}
.dir-filters .form.filtersBlock > div {
    display: block;
}
.dir-filters .formSearchButtons .sort > div {
    width: 100%;
}
.dir-filters .formCalendar > div {
    margin: 0 0 0 10px;
}
.filtersAction {
    padding: 10px!important;
    width: 60px!important;
}
.filtersAction div {
    background-image: url(/img/icons/filters.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    border: none!important;
    padding: 0!important;
    width: 24px;
    height: 24px;
    margin: 3px auto;
}
.filtersAction,
.demoresult,
.xMap {
	display: none;
}
.lineSearch {
    margin: 0;
}
#mapResult {
    width: 100%;
    height: 100%;
	background-image: url(/img/nomap.jpg?v=01);
    background-size: cover;
}
.hotelItem.demo {
	pointer-events: none;
    cursor: default;
}
.demoresult.load {
	display: block;
}
.demo .butDetails, 
.demo .hotelName, 
.demo .hotelLocation,
.demo .hotelDistance, 
.demo .room {
    border-radius: 4px;
    background: #f8f8f8;
    color: #f8f8f8;
    padding: 0 30px;
	margin: 5px 0;
}
.demo .toursPrices {
    display: none;
}
.demo .hover .icon{
    opacity: .3;
}
.demo .noPhoto {
    opacity: .5;
}

.hotelsResult {
	width: 100%;
}
.lineSearch,
.searchResult {
	width: 700px;
}
.mapResult {
	width: calc(100% - 990px);
}
.overxfilters a.exit,
.dir-filters.mobile {
	display: none;
}

@media (max-width: 1700px){
	
	.lineSearch,
	.searchResult {
		width: 520px;
	}
	.mapResult {
		width: calc(100% - 810px);
	}
	
}

@media (min-width: 1280px) and (max-width: 1700px){
	
	.searchResult .hotelInfo {
		flex-direction: column;
	}
	.searchResult .toursPrices {
		flex-direction: row-reverse;
		padding: 0 10px;
		justify-content: space-between;
		align-items: center;
		background: white;
		border-radius: var(--border-radius-one);
		margin: 5px 0 0 0;
	}
	.searchResult .tourPrice .blockPrice {
		margin-bottom: 0;
		width: auto;
		justify-content: flex-end;
	}
	.searchResult .tourPrice .blockPrice svg {
		width: 0;
	}
	.searchResult .noPhoto, .searchResult .miniPhoto {
		min-width: 100%;
		min-height: 240px;
		width: 100%;
	}
	.searchResult .hotelData {
		display: flex;
		flex-direction: column;
	}
	
}

@media (max-width: 1279px){
	
	.filters .mapToggle {
		display: block;
	}
	.mapResult.min,
	.searchResult.min {
		display: none;
	}
	.lineSearch,
	.searchResult {
		width: 100%;
	}
	.mapResult {
		width: calc(100% - 275px);
		margin-top: 75px;
	}
	
}

@media (max-width: 991px){
	
	.content {
		margin: 80px 0 10px 0;
	}
	.page {
		flex-direction: column;
	}
	.filters {
		display: flex;
		background: var(--background-one);
		border-radius: var(--border-radius-one);
	}
	.dir-filters.desktop {
		display: none;
	}
	.filters > .mapToggle {
		width: 100%;
		margin: 30px 10px 0 5px;
	}
	.dir-filters.mobile {
		display: flex;
		flex-direction: column;
		padding: 0;
	}
	.dir-filters.mobile > div {
		display: flex;
		align-items: baseline;
	}
	.dir-filters.mobile .form {
		margin: 0 10px;
	}
	.dir-filters .formSearchButtons {
		margin-bottom: 5px;
	}
	.formCharter > div {
		margin: 10px 20px 10px 0;
	}
	.formSearchButtons .sort > div {
		padding: 14px 20px;
		height: 50px;
	}
	.filterPrice .prices {
		height: 50px;
	}
	.payOffline, .payCancelation, .filters .item {
		padding: 10px;
	}
	.filters .mapToggle .form {
		margin: 0;
	}
	.filtersAction {
		display: block;
	}
	.overxfilters {
		position: fixed;
		width: 100%;
		height: 100%;
		padding: 50px 20px 30px 20px;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: white;
		z-index: 9999;
		overflow: auto;
		display: none;
	}
	.xfilters {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.xfilters > div {
		height: auto;
	}
	.overxfilters a.exit {
		display: block;
		margin: -35px 0 0 calc(100% - 60px);
	}
	.hotelsResult {
		margin-top: 15px;
	}
	.hotelsResult .toursPrices {
		flex-direction: row-reverse;
		align-items: center;
	}
	.mapResult.max {
		position: relative;
		top: 0;
		width: 100%;
		margin-top: 0;
	}
	.mapResult.min {
		display: block;
		position: absolute;
		top: -5000px;
		width: calc(100% - 30px);
	}
	.butShowHotels {
		float: none;
		margin-bottom: 0;
	}
	
	
	
}

@media (max-width: 767px){

	.filters > .mapToggle {
		width: 100%;
	}
	.xfilters > div {
		width: calc(50% - 20px);
	}
	.hotelDirection, .activeDepartCity, .activeCountry, .activeDateDepart, .activeNumberNights, .activeNumberTourists, .activeCities, .activeHotels, .activeTourOperators, .activeCategoryHotels, .activeMeals {
        width: 100%;
    }
	.formCalendar > div {
		width: calc(100% - 70px);
	}
	.filters {
		flex-direction: column;
	}
	.filters > .mapToggle {
		margin: 0;
		padding: 10px;
	}
	.dir-filters.mobile > div > div {
		width: 50%;
	}
	.filterPrice .prices {
		width: 100%;
	}
	.filterPrice .prices input {
		width: 100%;
	}
	.formCharter > .payOffline {
		margin: 10px 10px 0 0;
	}
	.formCharter > .payCancelation {
		margin: 10px 0 0 10px;
	}
	.formSearchButtons .sort > div {
		padding: 10px 20px;
		height: 40px;
	}
	.filterPrice .prices {
		height: 40px;
	}

}

@media (max-width: 649px){
	
	.hotelData {
		flex-direction: column;
	}
	.searchResult .noPhoto, 
	.searchResult .miniPhoto {
		width: 100%;
		height: 200px;
		position: relative;
	}
	.xfilters > div {
		width: 100%;
		margin-right: 0;
	}
	.dir-filters.mobile > div {
		flex-direction: column;
	}
	.formCharter > .payOffline,
	.formCharter > .payCancelation {
		margin: 10px 0 0 0;
		width: 100% !important;
	}
	.dir-filters.mobile > div > div {
		width: calc(100% - 20px);
	}
	
}

@media (max-width: 379px){

	.hotelsResult .toursPrices {
		flex-direction: column;
		align-items: flex-start;
	}
	.price {
		margin-bottom: 5px;
	}
	.summ {
		text-align: left;
	}

}