@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css");
@primary-light-100: #E7DEFE;
@primary-light-200: #CEBEFE;
@primary-light-300: #B49DFE;
@primary-light-400: #9F84FD;
@primary-default-500: #5E43D8;
@primary-hover-600: #5E43D8;
@primary-dark-700: #432EB5;
@primary-dark-800: #2D1D92;
@secondary-light-100: #F5FCD2;
@secondary-light-200: #E8FAA6;
@secondary-light-300: #D3F178;
@secondary-light-400: #BCE455;
@secondary-default-500: #36B257;
@secondary-hover-600: #7FB519;
@secondary-dark-700: #659711;
@secondary-dark-800: #4C7A0B;
@info-default: #209CEE;
@info-hover: #0E75B9;
@info-light: #ECF7FE;
@success-default: #48C774;
@success-hover: #257942;
@success-light: #EFFAF3;
@warning-default: #FFDD57;
@warning-hover: #947600;
@warning-light: #FFFBEB;
@danger-default: #FF3860;
@danger-hover: #DB002C;
@white-100: #F5F5F5;
@white-200: #FAFAFA;
@white-300: #FFFFFF;
@gray-secondary: #8080A4;
@gray-tertiary: #BEBED0;
@black-100: #0A0A0A;
@black-200: #121212;
@black-300: #242424;
@black-400: #363636;
@black-500: #4A4A4A;
@black-600: #7A7A7A;
@black-700: #B5B5B5;
@black-800: #DBDBDB;
@body-background-primary: #FBF9FF;
@main-color: #7C5CFC;
@main-color-low: #896cff;
@main-color-smooth: #8f77ec;
@main-color-dark: #5c42c2;
@main-color-extra-dark: #5E43D8;

* {
	padding: 0;
	margin: 0;
}

a {
	text-decoration: none;
}

body,
html {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: initial;
}

body {
	background-color: @body-background-primary !important;

}

body.small-side {
	.side-menu {
		display: none !important;
	}

	.small-side-menu {
		display: block !important;
	}
}

.gsc-control-cse {
	display: none;
}

.properties-container {
	width: 100%;
	height: 100%;
	float: left;
	color: white;
	width: 100%;
	display: flex;
	gap: 15px;
}

.properties-container .property {
	display: flex;
	align-items: center;
	gap: 5px;
}



.search-opened-card {
	width: calc(100% - 750px);
	height: 410px;
	left: 324px;
	position: fixed;
	top: 115px;
	display: none;
	background-color: #E8F8AD;
	border-radius: 0px 0px 8px 8px;
	z-index: 99999;

	.container {
		width: 100%;
		height: 100%;
		float: left;
		max-width: 100%;
		padding: 0;

		.left {
			width: calc(100% - 417px);
			height: 100%;
			float: left;
			border-right: 1px solid #DFDFDF;

			.popular-search {
				width: 100%;
				height: 163px;
				float: left;
				margin-top: 45px;
				border-bottom: 1px solid #DFDFDF;
				padding-left: 32px;
				padding-right: 12px;

				.title {
					width: 100%;
					height: 21px;
					float: left;
					display: flex;
					align-items: center;

					span {
						font-size: 18px;
						color: black;
						font-family: 'Roboto';
					}
				}

				.list {
					width: 100%;
					height: auto;
					float: left;
					margin-top: 19px;

					.item {
						width: auto;
						height: 32px;
						float: left;
						display: flex;
						align-items: center;
						margin-right: 9px;
						margin-top: 12px;

						a {
							padding: 7px 16px;
							border: 1px solid #DFDFDF;
							font-family: 'Roboto';
							font-size: 15px;
							color: #51595C;
							border-radius: 200px;
							text-decoration: none;

						}
					}

				}
			}

			.popular-users {
				width: 100%;
				height: auto;
				float: left;
				margin-top: 30px;
				padding-left: 32px;
				padding-right: 12px;

				.title {
					width: 100%;
					height: 21px;
					float: left;
					display: flex;
					align-items: center;

					span {
						font-size: 18px;
						color: black;
						font-family: 'Roboto';
					}
				}

				.list {
					width: 100%;
					height: 64px;
					float: left;
					margin-top: 29px;

					.item {
						width: 50%;
						height: 64px;
						float: left;
						padding-right: 12px;

						.image {
							width: 64px;
							height: 64px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: center;

							img {
								width: 64px;
								height: 64px;
								object-fit: cover;
							}
						}

						.i-right {
							width: calc(100% - 64px);
							height: 64px;
							float: left;
							padding-left: 16px;

							.name-verified {
								width: 100%;
								height: 19px;
								float: left;

								.name {
									width: auto;
									height: 19px;
									float: left;
									display: flex;
									align-items: center;
									max-width: calc(100% - 25px);

									span {
										font-weight: 500;
										font-size: 16px;
										font-family: 'Roboto';
										color: black;
									}
								}

								.verified {
									width: 16px;
									height: 16px;
									margin-left: 9px;
									float: left;
									display: flex;
									align-items: center;
									justify-content: center;

									span {
										width: 16px;
										height: 16px;
										display: flex;
										align-items: center;
										justify-content: center;
										background-color: #F8E71C;
										border-radius: 4px;
										font-size: 10px;
										color: black;
									}
								}
							}

							.location {
								width: 100%;
								height: 15px;
								float: left;
								display: flex;
								align-items: center;
								margin-top: 2px;

								span {
									font-family: 'Roboto';
									font-size: 13px;
									color: black;
								}
							}

							.info {
								width: 100%;
								height: 27px;
								float: left;
								display: flex;
								align-items: center;
								margin-top: 1px;

								span {
									color: #FF0000;
									font-size: 11px;
									font-family: 'Roboto';
									line-height: 100%;
								}
							}
						}
					}
				}
			}
		}

		.right {
			width: 417px;
			float: left;
			height: 100%;

			.sponsored {
				width: 100%;
				height: 100%;
				padding-left: 45px;
				padding-right: 31px;
				padding-top: 21px;
				padding-bottom: 39px;
				float: left;

				.top {
					width: 100%;
					height: 32px;
					float: left;

					.title {
						width: calc(100% - 73px);
						height: 32px;
						float: left;
						display: flex;
						align-items: center;

						span {
							font-size: 14px;
							font-family: 'Roboto';
						}
					}

					.buttons {
						width: 73px;
						height: 32px;
						float: left;
						display: flex;
						justify-content: space-between;

						.item {
							width: 32px;
							height: 32px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: center;

							span {
								font-size: 24px;
								color: #6B7280;
								cursor: pointer;
							}

						}
					}
				}

				.list {
					width: 100%;
					height: calc(100% - 32px);
					float: left;

					.item {
						width: 100%;
						height: 150px;
						float: left;
						background-color: #FCFCFF;
						box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
						border-radius: 10px;
						border: 1px solid #F5F5F5;
						margin-top: 10px;

						a {
							width: 100%;
							height: 100%;
							float: left;
							display: block;
						}

						.item-container {
							width: 100%;
							height: 100%;
							float: left;

							.top {
								width: 100%;
								height: calc(100% - 32px);
								float: left;
								padding: 10px;
								box-shadow: 0px 0px 6px rgba(34, 34, 34, 0.08);

								.photo {
									width: 122px;
									height: 100%;
									float: left;

									.image {
										width: 100%;
										height: 100%;
										float: left;

										img {
											width: 100%;
											height: 100%;
											object-fit: cover;
											border-radius: 10px;
											text-align: center;
										}
									}

									.actions {
										width: 100%;
										height: 18px;
										float: left;
										margin-top: -86px;

										.like {
											width: 18px;
											height: 18px;
											float: left;
											display: flex;
											align-items: center;
											justify-content: center;
											margin-left: 6px;

											span {
												color: @danger-default;
												font-size: 18px;
											}
										}

										.slider-selectors {
											width: 36px;
											height: 18px;
											float: right;
											margin-right: 10px;

											.selector {
												width: 12px;
												height: 18px;
												float: left;
												display: flex;
												align-items: center;
												justify-content: center;

												span {
													padding: 0.5px 2px;
													background-color: white;
													border-radius: 100%;
													color: #BCE455;
													font-size: 6px;
												}
											}
										}
									}
								}

								.right {
									width: calc(100% - 122px);
									height: 100%;
									float: left;

									.right-container {
										padding-left: 13px;
										width: 100%;
										float: left;
										height: 100%;

										.hood {
											width: 100%;
											height: 15px;
											float: left;
											display: flex;
											margin-top: 8px;
											align-items: center;

											span {
												font-weight: 600;
												font-size: 10px;
												color: #000;
												text-decoration: none;
												-webkit-line-clamp: 2;
												overflow: hidden;
												-webkit-box-orient: vertical;
												display: -webkit-box;
												word-break: break-all;
											}
										}

										.location {
											width: 100%;
											height: 12px;
											float: left;
											margin-top: 8px;
											display: flex;
											align-items: center;

											span {
												font-size: 10px;
												color: @gray-secondary;
											}
										}

										.date {
											width: 100%;
											height: 15px;
											float: left;
											display: flex;
											align-items: center;
											margin-top: 8px;

											span {
												font-size: 10px;
												color: @gray-secondary;
											}
										}

										.bottom {
											width: 100%;
											height: 17px;
											float: left;
											margin-top: 12px;

											.selling {
												width: auto;
												height: 17px;
												float: left;
												display: flex;
												align-items: center;

												span {
													color: @secondary-default-500;
													font-weight: 500;
													font-size: 10px;
												}
											}

											.price {
												width: auto;
												height: 17px;
												float: right;
												display: flex;
												align-items: center;

												span {
													font-weight: 600;
													font-size: 12px;
													color: #2D1D92;
												}
											}
										}
									}
								}
							}

							.bot {
								width: 100%;
								height: 32px;
								float: left;

								.properties-s {
									width: 100%;
									height: 32px;
									//   float: left;
									display: flex;
									justify-content: center;
									padding: 0 10px;

									.property {
										width: 100%;
										height: 32px;
										// float: left;
										margin-left: 25px;
										display: flex;
										align-items: center;

										.icon {
											width: 24px;
											height: 32px;
											//   float: left;
											display: flex;
											align-items: center;
											justify-content: center;

											img {
												width: 15px;
											}
										}

										.value {
											width: auto;
											height: 32px;
											//    float: left;
											display: flex;
											align-items: center;

											span {
												font-size: 12px;
												font-weight: 500;
												color: #121212;
											}
										}
									}

									.property:first-child {
										margin-left: 0;
									}
								}
							}
						}
					}
				}
			}
		}
	}
}


.page-404 {
	width: calc(100% - 774px);
	margin-left: 329px;
	float: left;
	text-align: center;
	font-family: 'Roboto';
	margin-bottom: 50px;
	background-color: White;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 24px;
	padding-bottom: 40px;

	.container {
		width: 90%;
		height: auto;
		float: left;
		max-width: 694px;
		padding: 0;
		margin-top: 0;

		.vector {
			width: 100%;
			height: auto;
			float: left;

			img {
				width: 100%;
			}
		}

		.title {
			width: 100%;
			margin-top: 45px;
			float: left;
			height: 60px;

			span {
				font-weight: 600;
				font-size: 40px;
				line-height: 60px;
				color: #FF3860;
			}
		}

		.info {
			width: 100%;
			height: 48px;
			float: left;
			margin-top: 31px;

			span {
				line-height: 48px;
				font-weight: 600;
				font-size: 32px;
				color: @main-color;

			}
		}

		.button {
			width: 90%;
			height: 48px;
			margin: 0;
			padding: 0;
			max-width: 365px;
			margin-left: 50%;
			transform: translateX(-50%);
			text-align: center;
			margin-top: 42px;
			float: left;
			background-color: @main-color;
			border-radius: 3px;

			a {
				line-height: 48px;
				font-size: 16px;
				color: white;
				font-weight: 600;
			}
		}

		.sub-info {
			width: 100%;
			height: 30px;
			margin-top: 20px;
			float: left;

			a {
				line-height: 30px;
				font-size: 20px;
				color: #8080A4;
			}
		}
	}
}



.no-content-error {
	width: 100%;
	height: 300px;
	float: left;
	display: flex;
	align-items: center;

	.error-container {
		width: 100%;
		height: auto;
		float: left;

		.image {
			width: 100%;
			height: auto;
			float: left;
			display: flex;
			justify-content: center;

			img {
				max-width: 90%;
			}
		}

		.text {
			width: 100%;
			height: auto;
			float: left;
			margin-top: 12px;
			display: flex;
			justify-content: center;

			span {
				color: black;
			}
		}

	}
}



.banner-in-top {
	width: 100%;
	height: 114px;
	float: left;
	//  background-image: url('../images/ilan-ekle-banner-background.webp');
	//  background-color:#7352A8;
	//  background-repeat:no-repeat;
	//  border-radius: 10px 10px 0px 0px;
	font-family: 'Inter';
	width: 100%;
	background-image: url(https://yeni.emlakvarsa.com/assets/images/content-top-background.png);
	background-size: 86%;
	background-repeat: no-repeat;
	background-position: center;
	background-color: #6B4EE7;
	border: 1px solid #F5F5F5;
	border-radius: 10px;

	.title {
		width: 100%;
		height: 60px !important;
		margin-top: 30px;
		display: flex;
		justify-content: center;
		float: left;

		.title-container {
			background-image: url('../images/ilan-ekle-title-background.png');
			background-position: top left;
			padding-left: 15px;
			background-repeat: no-repeat;
			width: auto;
			float: left;
			height: 60px;
			display: flex;
			align-items: center;
		}

		span {
			color: white !important;
			font-weight: 700 !important;
			font-size: 32px !important;

		}

	}

	.search-filter {
		width: 220px;
		height: 60px;
		margin-top: 30px;
		float: right;

		button {
			background-color: transparent;
			border: 0px;
			width: 188px;
			height: 40px;
			margin-top: 10px;

			.button-c {
				width: 100%;
				height: 100%;
				float: left;
				display: flex;
				justify-content: center;
				background-color: white;
				border-radius: 8px;

				.icon {
					width: 24px;
					height: 100%;
					float: left;
					display: flex;
					align-items: center;
					justify-content: center;

					span {
						color: #7353A8;
						font-size: 20px;
					}
				}

				.text {
					width: auto;
					height: 100%;
					float: left;
					display: flex;
					align-items: center;

					span {
						font-weight: 600;
						font-size: 16px;
						color: #7353A8;
					}
				}
			}
		}
	}

	.profile-social {
		width: 145px;
		height: 100%;
		float: left;

		.socials {
			width: 100%;
			height: 34px;
			float: right;
			margin-top: 22px;
			margin-right: 11px;

			.item {
				width: 34px;
				height: 34px;
				float: right;
				display: flex;
				align-items: center;
				justify-content: center;

				a {
					font-size: 18px;
					color: white;

				}
			}
		}
	}
}

.banner-in-top.in-search {
	border-radius: 10px 10px 0px 0px;

	.title {
		width: calc(100% - 220px) !important;
	}

	.title-container {
		margin-left: 220px;
	}
}

.banner-in-top.in-profile {
	.title {
		width: calc(100% - 145px);
	}

	.title-container {
		margin-left: 145px;
	}
}

.mobile-header-n {
	width: 100%;
	height: 39px;
	float: left;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 9999;
	background-color: @main-color-smooth;

	.container {
		width: 100%;
		height: 100%;
		float: left;

		.logo {
			width: calc(100% - 44px);
			height: 100%;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;

			img {
				margin-left: 44px;
				height: 13.23px;
			}
		}

		.right {
			width: 32px;
			height: 100%;
			float: left;
			display: flex;
			align-items: center;
			justify-content: right;
		}
	}
}


.mobile-header {
	width: 100%;
	height: 48px;
	position: fixed;
	top: 0px;
	font-family: 'Inter';
	left: 0px;
	z-index: 99999;
	background-color: #FFFFFF;

	.container {
		width: 100%;
		height: 100%;
		max-width: 100%;
		padding: 0;
		-bs-gutter-x: 0rem;
		float: left;

		.return {
			width: 24px;
			height: 48px;
			float: left;
			margin-left: 16px;
			display: flex;
			align-items: center;
			justify-content: center;

			span {
				color: black;
				font-size: 32px;
			}
		}

		.center {
			width: calc(100% - 88px);
			height: 48px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;

			span {
				font-weight: 600;
				font-size: 16px;
				color: #5E43D8;
			}
		}

		.menu {
			width: 32px;
			height: 48px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;

			span {
				font-size: 24px;
				color: black;
			}
		}
	}
}


.mobile-bot {
	width: 100%;
	height: 68px;
	position: fixed;
	bottom: 0px;
	padding-top: 4px;
	padding-bottom: 4px;
	display: none;
	border-top: 1px solid #777;

	@media screen and (max-width: 768px) {
		display: block;
	}

	left: 0px;
	z-index: 9999;
	background-color:#FFFFFF;

	.container {
		width: 100%;
		max-width: 100%;
		height: 100%;
		float: left;

		.item {
			width: 20%;
			height: 100%;
			float: left;
			border-radius: 4px;

			.icon {
				width: 100%;
				height: 24px;
				float: left;
				display: flex;
				align-items: center;
				justify-content: center;
				margin-top: 7px;

				img {}
			}

			.text {
				width: 100%;
				height: 15px;
				float: left;
				display: flex;
				margin-top: 4px;
				align-items: center;
				justify-content: center;

				span {
					color: #A8AABD;
					font-size: 10px;
					font-weight: 500;
					font-family: 'Inter';
				}
			}
		}

		.item.active {
			.text span {
				color: @main-color;
			}
		}
	}
}

.side-menu-container {
	width: auto;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 99999999999;
	background-color: rgba(0, 0, 0, 0.73);
}

.side-menu {
	width: 304px;
	height: 100%;
	float: left;
	position: fixed;
	top: 0px;
	font-family: 'Inter';
	left: 0px;
	background-color: #FFF;
	box-shadow: 0px 0px 2px rgba(34, 34, 34, 0.08);
	background-image: url('../images/site/yeni-header-background.png');
	background-repeat: no-repeat;
	z-index: 9999;

	.user-settings-btn {
		position: relative;
		z-index: 2;
	}

	.user-settings-btn .toggle-btn {
		transition: all .2s ease;
		user-select: none;
		cursor: pointer;
		border-radius: 8px;
		padding: 5px 7px;
		background-color: @main-color;
		height: 48px;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.user-settings-btn.active .toggle-btn {
		border-radius: 0 0 8px 8px;
	}

	.user-settings-btn .toggle-btn .user-photo {
		--size: 35px;
		height: var(--size);
		width: var(--size);
		min-width: var(--size);
		overflow: hidden;
		border-radius: 50%;
	}

	.user-settings-btn .toggle-btn .user-photo img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.user-settings-btn .toggle-btn .title {
		margin-top: 0 !important;
	}

	.user-settings-btn .toggle-btn .title>span {
		color: white !important;
	}

	.user-settings-btn .toggle-btn .title {}

	.user-settings-btn .toggle-btn .icon {
		transition: all .2s ease;
		margin-top: 2px !important;
		color: white;
		width: fit-content !important;
	}

	.user-settings-btn.active .toggle-btn .icon {
		transform: rotate(180deg);
	}

	.user-settings-btn .menu-btns {
		opacity: 0;
		transition: all .2s ease;
		transform-origin: bottom;
		transform: rotateX(90deg);
		padding: 6px 0;
		display: flex;
		width: 100%;
		border-radius: 8px 8px 0 0;
		background-color: @main-color;
		flex-direction: column;
		gap: 1px;
		position: absolute;
		bottom: calc(100% + 3px);
	}

	.user-settings-btn.active .menu-btns {
		opacity: 1;
		transform: rotateX(0deg);
	}

	.user-settings-btn .menu-btns>a {
		transition: all .2s ease;
		padding: 4px 15px;
		font-size: 14px;
		font-weight: 500;
		text-decoration: none;
		color: white;
		width: 100%;
		display: flex;
		align-items: center;
	}

	.user-settings-btn .menu-btns>a:hover {
		padding-left: 20px;
		background-color: rgba(255, 255, 255, 0.1);
	}

	.container {
		width: 100%;
		height: 100%;
		float: left;
		margin: 0;
		padding: 0;

		.top {
			width: 100%;
			height: 40px;
			float: left;
			margin-top: 42px;

			.logo {
				width: 86%;
				height: 19.47px;
				float: left;
				margin-top: 10px;
				text-align: center;
				margin-left: 26px;

				img {
					width: 85%;
				}
			}

			.toggle {
				width: 40px;
				height: 40px;
				float: right;
				display: none;

				.container {
					width: 40px;
					height: 40px;
					float: right;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-right: -15px;
					box-shadow: 0px 4px 12px rgba(24, 24, 24, 0.04);
					background: #FFFFFF;
					cursor: pointer;
					border-radius: 400px;

					span {
						font-size: 24px;
						text-align: center;
						color: @primary-default-500;
					}
				}

			}

		}

		.menu {
			width: 100%;
			height: calc(100% - 223px);
			float: left;
			overflow-y: scroll;

			.container {
				width: calc(100% - 42px);
				height: auto;
				float: left;
				margin-left: 21px;
				margin-top: 60px;
				padding: 0;

				ul {
					margin: 0;
					padding: 0;
				}

				.item {
					width: 100%;
					margin-top: 10px;
					height: 48px;
					cursor: pointer;
					float: left;
					background-color: white;
					transition: 0.2s;
					border-radius: 8px;
					padding: 0;

					.item-container {
						width: 100%;
						height: 100%;
						float: left;
					}

					.icon {
						width: 24px;
						height: 24px;
						float: left;
						text-align: center;
						margin-left: 16px;
						margin-top: 12px;
						display: flex;
						align-items: center;
						justify-content: center;

						img {
							height: 20px;
							text-align: center;
						}

						span {
							color: #8080A4;
							font-size: 22px;
						}
					}

					.title {
						width: calc(100% - 72px);
						height: 24px;
						float: left;
						margin-top: 12px;
						display: flex;
						align-items: center;

						span {
							color: @gray-secondary;
							margin-left: 12px;
							font-size: 16px;
							white-space: nowrap;
						}
					}

					.chevron {
						width: 20px;
						height: 24px;
						float: left;
						margin-top: 12px;
						display: flex;
						align-items: center;
						justify-content: center;

						span {
							color: @gray-secondary;
							font-size: 14px;
							display: block;
							margin-top: 5px;

						}
					}

					.opened-menu {
						width: 229px;
						height: auto;
						position: fixed;
						left: 317px;
						float: left;
						display: none;
						background-color: white;
						border-radius: 0px 15px 15px 15px;
						padding-bottom: 7px;

						.opened-menu-title {
							width: 100%;
							height: 32px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: center;

							span {
								font-weight: 500;
								font-size: 12px;
								color: #777777;
								margin-top: 10px;
								border-bottom: 1px solid black;
							}
						}

						.opened-menu-inner {
							width: 100%;
							height: auto;
							float: left;
							margin-top: 13px;
						}

						.opened-item {
							width: 100%;
							height: 32px;
							float: left;
							padding-left: 16px;
							padding-right: 8px;

							.opened-item-container {
								width: 100%;
								height: 32px;
								float: left;
							}

							.o-icon {
								width: 16px;
								height: 32px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;

								span {
									color: #777777;
									font-size: 16px;
								}
							}

							.o-text {
								width: calc(100% - 36px);
								height: 32px;
								float: left;
								display: flex;
								align-items: center;
								padding-left: 8px;

								span {
									color: #444444;
									font-size: 14px;
								}
							}

							.o-chevron {
								width: 20px;
								height: 32px;
								float: left;
								display: none;
								align-items: center;
								justify-content: center;

								span {
									color: #434242;
								}
							}

							.opened-item-opened {
								width: 205px;
								height: 327px;
								position: fixed;
								left: 550px;
								background-color: white;
								border-radius: 0px 15px 15px 15px;
								padding-top: 4px;
								padding-bottom: 7px;
								display: none;

								.oio-all {
									width: 100%;
									height: 32px;
									float: left;
									padding-left: 16px;
									padding-right: 9px;

									.oio-icon {
										width: 16px;
										height: 32px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: center;

										span {
											color: #777777;
											font-size: 14px;
										}
									}

									.oio-all-text {
										width: calc(100% - 36px);
										height: 32px;
										float: left;
										padding-left: 8px;
										display: flex;
										align-items: center;

										span {
											color: #777;
											font-size: 14px;
										}
									}

									.oio-all-chevron {
										width: 20px;
										height: 32px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: center;

										span {
											font-size: 14px;
											color: #434242;
										}
									}
								}

								.oio-v-list {
									width: 100%;
									height: calc(100% - 32px);
									float: left;

									.oio-v-item {
										width: 100%;
										height: 32px;
										float: left;
										padding-left: 16px;
										padding-right: 8px;

										.oio-v-icon {
											width: 16px;
											height: 32px;
											float: left;
											display: flex;
											align-items: center;
											justify-content: center;

											span {
												color: #777777;
												font-size: 16px;
											}
										}

										.oio-v-text {
											width: calc(100% - 36px);
											height: 32px;
											float: left;
											display: flex;
											align-items: center;
											padding-left: 8px;

											span {
												color: #777;
												font-size: 14px;
											}
										}

										.oio-v-chevron {
											width: 20px;
											height: 32px;
											float: left;
											display: none;
											align-items: center;
											justify-content: center;

											span {
												color: #434242;
											}
										}
									}

								}

								.oio-v-list::-webkit-scrollbar {
									width: 6px;
								}

								/* Track */
								.oio-v-list::-webkit-scrollbar-track {
									background: #f1f1f1;
									border-radius: 15px;
								}

								/* Handle */
								.oio-v-list::-webkit-scrollbar-thumb {
									background: #888;
									border-radius: 15px;
								}

								/* Handle on hover */
								.oio-v-list::-webkit-scrollbar-thumb:hover {
									background: #555;
								}
							}

						}

						.oio-opened {
							.opened-item-opened {
								display: block;
							}

							.o-chevron {
								display: flex;
							}
						}
					}
				}

				.item.actived {
					background-color: #ececec;

					.title {

						span {
							color: @primary-default-500;
							font-weight: 600;
						}
					}
				}

				.item.opened {
					.opened-menu {
						display: block;
					}
				}

				.item:hover {
					background-color: @white-100;
				}
			}
		}

		/* width */
		.menu::-webkit-scrollbar {
			width: 0px;
		}

		.bot {
			width: 100%;
			float: left;
			height: 105px;

			.container {
				width: calc(100% - 42px);
				float: left;
				margin-left: 21px;
				height: 105px;

				.item {
					width: 100%;
					height: 48px;
					float: left;
					border-radius: 8px;
					background-color: #FAF8FF;

					.icon {
						width: 24px;
						height: 24px;
						float: left;
						margin-top: 12px;
						margin-left: 16px;
						text-align: center;
						display: flex;
						align-items: center;
						vertical-align: middle;

						img {
							height: 20px;
						}

						span {
							color: black;
						}
					}

					.title {
						width: calc(100% - 40px);
						height: 24px;
						float: left;
						margin-top: 12px;
						display: flex;
						align-items: center;

						span {
							margin-left: 12px;
							font-size: 16px;
							color: @gray-secondary;
						}
					}
				}

				.item.btn1 {
					display: flex;
					background-color: #CFE992;
				}

				.item.btn1 .title span {
					color: black;
					margin: 0;
				}

				.item:last-child {
					margin-top: 9px;
				}

				.item:last-child a {
					display: flex;
				}

				.item .img {
					display: flex;
					align-items: center;
					justify-content: center;
					margin: 8px 0 0 12px;
					height: 100%;
					aspect-ratio: 1;
					border-radius: 50%;
					overflow: hidden;
				}

				.item .img img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}

				.item .img.sml {
					margin: 0 0 0 5px;
				}

				.item .img.sml img {
					width: 20px;
					height: unset;
					object-fit: unset;
				}

				.item:last-child .icon {
					margin: 12px 12px 0 0;
				}

				.item.logined {
					background-color: transparent;

					.item-container {
						width: calc(100% - 70px);
						height: 100%;
						float: left;
						background-color: @main-color;
						border-radius: 8px;

						span {
							color: white;
						}
					}

					.user-photo {
						width: 53px;
						height: 100%;
						float: right;
						display: flex;
						justify-content: center;
						align-items: center;

						img {
							width: 53px;
							height: 53px;
							object-fit: cover;
							text-align: center;
							border-radius: 5px;
						}
					}
				}

				.not-logined-h {
					background-color: @main-color;
					cursor: pointer;
					transition: 0.3s;

					span {
						color: white !important;
					}
				}

				.not-logined-h:hover {
					background-color: @main-color;
				}
			}
		}
	}
}


.small-side-menu {
	width: 73px;
	height: 100%;
	float: left;
	position: fixed;
	top: 0px;
	font-family: 'Inter';
	left: 0px;
	background-color: #FFF;
	box-shadow: 0px 0px 8px rgba(34, 34, 34, 0.08);
	background-image: url('../images/site/yeni-header-background.png');
	background-repeat: no-repeat;
	z-index: 9999;
	display: none;

	.container {
		width: 100%;
		height: 100%;
		float: left;
		padding: 0px;

		.logo-toggle {
			width: 100%;
			height: 64px;
			float: left;
			margin-top: 18px;

			.logo {
				width: 100%;
				height: 17px;
				float: left;
				display: flex;
				align-items: center;
				justify-content: center;

				img {
					height: 17px;
				}
			}

			.toggle {
				width: 100%;
				height: 40px;
				float: left;
				display: flex;
				margin-top: 7px;
				align-items: center;
				justify-content: right;

				.inner {
					width: 40px;
					height: 40px;
					float: left;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 40px;
					margin-right: -20px;
					position: relative;
					z-index: 999;
					box-shadow: 0px -1px 10px rgba(0, 0, 0, 0.25);

					span {
						color: @primary-default-500;
					}
				}
			}
		}

		.menu {
			width: 100%;
			height: calc(90% - 187px);
			float: left;
			padding-left: 14px;
			padding-right: 4px;
			margin-right: 5%;
			overflow-y: scroll;

			ul {
				list-style: none;
				padding: 0;
				margin: 0;
			}

			.item {
				width: 100%;
				height: 48px;
				float: left;
				margin-top: 10px;
				border-radius: 8px;

				.icon {
					width: 100%;
					height: 100%;
					float: left;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
		}

		/* width */
		.menu::-webkit-scrollbar {
			width: 0px;
		}

		.bot {
			width: 100%;
			height: 105px;
			float: left;
			padding-left: 14px;
			padding-right: 4px;

			.container {
				width: 100%;
				height: 100%;
				float: left;

				.item {
					width: 100%;
					height: 48px;
					float: left;
					background-color: #FAF8FF;

					.icon {
						width: 100%;
						height: 100%;
						float: left;
						display: flex;
						align-items: center;
						justify-content: center;

						span {
							color: @gray-secondary;
						}
					}
				}

				.item:nth-child(2) {
					margin-top: 9px;
				}
			}
		}

	}
}


.header-search {
	width: calc(100% - 724px);
	height: 98px;
	position: fixed;
	top: 0px;
	left: 304px;
	background-color: #FFF;
	z-index: 9998;
	box-shadow: 0px 8px 8px -10px rgba(34, 34, 34, 0.08);

	.container {
		width: calc(100% - 40px);
		height: 98px;
		float: left;
		margin-left: 15px;
		max-width: 100%;
		--bs-gutter-x: 0rem;

		.left-open-toggle {
			width: 40px;
			height: 98px;
			float: left;
			display: none;
			align-items: center;
			justify-content: center;

			span {
				font-size: 24px;
			}
		}

		.item {
			width: 100%;
			height: 50px;
			float: left;
			background-color: rgba(150, 153, 228, .33);
			box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);
			margin-top: 24px;
			border-radius: 8px;
			display: flex;
			align-items: center;

			.search-btn {
				transition: all .2s ease;
				font-size: 23px;
				padding: 0 20px;
				border-radius: 8px;
				background-color: @main-color-extra-dark;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				color: white;
			}

			.search-btn:hover {
				background-color: @main-color-dark;
			}

			.icon {
				width: 50px;
				height: 50px;
				float: left;
				display: flex;
				align-items: center;
				justify-content: center;

				button {
					width: 50px;
					height: 50px;
					background-color: transparent;
					border: 0px;
					outline: 0px;
				}

				span {
					color: @primary-default-500;
					font-size: 20px;
				}
			}

			.input {
				width: calc(100% - 50px);
				height: 50px;
				float: left;

				input {
					background-color: transparent;
					width: 100%;
					height: 50px;
					border: 0;
					outline: 0;
				}

				input::placeholder {
					/* Chrome, Firefox, Opera, Safari 10.1+ */
					color: @black-600;
					opacity: 1;
					/* Firefox */
				}

				input:-ms-input-placeholder {
					/* Internet Explorer 10-11 */
					color: @black-600;
				}

				input::-ms-input-placeholder {
					/* Microsoft Edge */
					color: @black-600;
				}
			}
		}

		.user {
			width: 40px;
			height: 98px;
			float: right;
			margin-right: 14px;
			display: flex;
			align-items: center;
			justify-content: center;

			.image {
				width: 40px;
				height: 40px;
				margin-top: 5px;
				float: left;

				img {
					width: 40px;
					height: 40px;
					object-fit: cover;
					text-align: center;
					border-radius: 5px;
				}
			}
		}

		.right-open-toggle {
			width: 40px;
			height: 98px;
			float: right;
			display: none;
			align-items: center;
			justify-content: center;

			span {
				font-size: 24px;
			}
		}
	}

}


.right-side {
	width: 420px;
	height: 100%;
	position: fixed;
	top: 0px;
	right: 0px;
	z-index: 9999;
	font-family: 'Inter';
	box-shadow: 0px 0px 2px rgba(34, 34, 34, 0.08);
	background-color: white;

	.container {
		width: calc(100% - 38px);
		margin-left: 19px;
		padding: 0;
		height: 100%;
		max-width: calc(100% - 38px);
		float: left;

		.small-close {
			width: 100%;
			height: 30px;
			float: left;
			display: none;
			align-items: center;
			margin-top: 12px;

			span {
				color: @main-color-smooth;
				padding-bottom: 3px;
				border-bottom: 1.5px solid @main-color-smooth;
				font-size: 16px;
				font-weight: 500;
				transition: 0.3s;
				cursor: pointer;
			}

			span:hover {
				color: #4D07C9;
				border-bottom: 1.5px solid #4D07C9;
			}
		}

		.menu {
			width: calc(100% - 0px);
			height: 72px;
			border-radius: 10px;
			padding-left: 15px;
			padding-right: 15px;
			border: 1px solid #F5F5F5;
			float: left;
			margin-top: 20px;

			.item {
				width: calc(25% - 15.75px);
				height: 52px;
				float: left;
				margin-top: 10px;
				margin-left: 21px;
				border-radius: 12px;
				transition: 0.3s;
				cursor: pointer;

				.icon {
					width: 100%;
					height: 100%;
					float: left;
					display: flex;
					align-items: center;
					justify-content: center;

					span {
						font-size: 24px;
						color: @main-color-low;
					}
				}
			}

			.active {
				background-color: #A6B8FA;

				.icon span {
					color: black;
				}
			}

			.item:first-child {
				margin-left: 0;
			}

			.item:hover {
				background-color: #EEE;
			}

			.active:hover {
				background-color: @main-color-low;

				.icon span {
					color: white;
				}
			}
		}

		.content {
			width: 100%;
			height: calc(100% - 92px);
			float: left;

			.please-login {
				width: 100%;
				height: 100%;
				float: left;
				padding-left: 16px;
				padding-right: 16px;
				display: none;

				.l-container {
					width: 100%;
					height: 100%;
					float: left;
					overflow-y: scroll;

					.vector {
						width: 100%;
						height: auto;
						float: left;

						.image {
							width: 100%;
							height: auto;
							float: left;
							padding-top: 14px;
							padding-bottom: 14px;
							background-color: @main-color;
							border-radius: 50px;

							img {
								width: 100%;
								height: auto;
							}
						}
					}

					.info-text {
						width: 100%;
						height: auto;
						float: left;
						margin-top: 10%;

						p {
							color: #464444;
							font-size: 18px;
							font-weight: 700;
							text-align: center;
						}
					}

					.buttons {
						width: 100%;
						height: 65px;
						float: left;
						display: flex;
						justify-content: center;
						margin-top: 10%;

						.login-button {
							width: 137px;
							height: 45px;
							float: left;
							border-radius: 15px 0px 0px 15px;
							background-color: @main-color;

							a {
								color: white;
								font-weight: 500;
								font-size: 18px;
								display: block;
								width: 100%;
								height: 100%;
								text-decoration: none;
								display: flex;
								align-items: center;
								justify-content: center;
							}
						}

						.register-button {
							width: 132px;
							height: 45px;
							float: left;
							border-radius: 0px 15px 15px 0px;
							background-color: #F3F3F3;

							a {
								color: #545151;
								font-weight: 500;
								font-size: 18px;
								text-decoration: none;
								display: block;
								width: 100%;
								height: 100%;
								display: flex;
								align-items: center;
								justify-content: center;
							}
						}
					}
				}

				/* width */
				.l-container::-webkit-scrollbar {
					width: 0px !important;
				}
			}

			.content-container {
				width: 100%;
				height: 100%;
				float: left;
				display: none;

				.explore {
					width: 100%;
					height: calc(100% - 24px);
					float: left;
					margin-top: 6px;
					padding-bottom: 91px;
					overflow-y: scroll;
					margin-bottom: 40px;

					.item {
						width: 100%;
						height: 266px;
						float: left;
						margin-top: 18px;
						background-color: #FBF9FF;
						border: 1px solid #F5F5F5;
						border-radius: 10px;

						.title {
							width: 100%;
							height: 30px;
							float: left;
							display: flex;
							align-items: center;
							margin-top: 18px;

							span {
								margin-left: 24px;
								margin-right: 24px;
								font-size: 20px;
								font-weight: 500;
								color: black;
							}
						}

						.info {
							width: 100%;
							height: 84px;
							float: left;
							display: flex;
							align-items: center;
							margin-top: 8px;

							p {
								padding-left: 24px;
								color: #8080A4;
								font-size: 14px;
								padding-right: 52px;

							}
						}

						.bottom {
							width: 100%;
							height: 152px;
							float: left;
							margin-top: -24px;

							.link {
								width: 60px;
								height: 60px;
								float: left;
								margin-top: 70px;
								margin-left: 24px;
								display: flex;
								align-items: center;
								justify-content: center;

								span {
									display: flex;
									width: 58px;
									height: 58px;
									background-color: @primary-light-100;
									color: @primary-hover-600;
									border-radius: 58px;
									align-items: center;
									justify-content: center;
									font-size: 30px;
									cursor: pointer;
									transition: 0.3s;
								}

								span:hover {
									background-color: @primary-light-200;
								}
							}

							.vector {
								width: 150px;
								height: auto;
								float: right;
								display: flex;
								justify-content: center;

								img {
									width: 90%;
								}

							}
						}
					}

					.item:first-child {
						background-image: url(../images/right-talep-backgrond.png);
						background-repeat: no-repeat;
						background-position: right center;
					}

					.item:nth-child(2) {
						background-image: url(../images/right-room-friend-backgrond.png);
						background-repeat: no-repeat;
						background-position: right center;
					}

					.item:nth-child(3) {
						background-image: url(../images/right-mulk-emanet-backgrond.png);
						background-repeat: no-repeat;
						background-position: right center;
					}

					.item.not-available {
						.vector {
							img {
								filter: grayscale(100%);
							}
						}

						.link {
							span {
								filter: grayscale(100%);
							}
						}
					}
				}

				/* width */
				.explore::-webkit-scrollbar {
					width: 8px;
				}

				/* Track */
				.explore::-webkit-scrollbar-track {
					background: #E5E5EA;
				}

				/* Handle */
				.explore::-webkit-scrollbar-thumb {
					background: @primary-default-500;
				}

				/* Handle on hover */
				.explore::-webkit-scrollbar-thumb:hover {
					background: @primary-hover-600;
				}

				.notifications {
					width: 100%;
					height: calc(100% - 24px);
					margin-top: 24px;
					float: left;

					.list {
						width: 100%;
						height: calc(100% - 130px);
						float: left;
						overflow-y: scroll;

						.item {
							width: calc(100% - 9px);
							height: 107px;
							float: left;
							margin-bottom: 18px;
							background-color: #FCFCFF;
							border-radius: 10px;
							border: 1px solid #F5F5F5;

							.left {
								width: 60px;
								height: 100%;
								float: left;
								display: flex;
								align-items: flex-end;

								img {
									width: 58px;
								}
							}

							.center {
								width: calc(100% - 120px);
								margin-left: 24px;
								float: left;
								height: 100%;

								.title {
									width: 100%;
									height: 26px;
									float: left;
									display: flex;
									margin-top: 19px;
									align-items: center;

									span {
										font-weight: 500;
										color: #2D1D92;
										font-size: 16px;
									}
								}

								.info {
									width: 100%;
									height: 42px;
									float: left;
									margin-top: 12px;
									display: flex;
									align-items: center;

									p {
										font-size: 14px;
										color: #363636;
										line-height: 150%;
									}
								}
							}

							.delete {
								width: 24px;
								height: 24px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;
								margin-top: 12px;

								span {
									font-size: 24px;
									color: @black-400;
								}
							}
						}
					}

					/* width */
					.list::-webkit-scrollbar {
						width: 8px !important;
					}

					/* Track */
					.list::-webkit-scrollbar-track {
						background: #E5E5EA;
						border-radius: 120px;
					}

					/* Handle */
					.list::-webkit-scrollbar-thumb {
						background: @main-color-low;
						border-radius: 120px;
					}

					/* Handle on hover */
					.list::-webkit-scrollbar-thumb:hover {
						background: @primary-hover-600;
					}

					.see-all {
						width: 100%;
						height: 48px;
						float: left;
						display: flex;
						align-items: center;
						justify-content: right;
						margin-top: 36px;

						a {
							padding: 12px 32px;
							background-color: @main-color-low;
							color: @white-300;
							transition: 0.3s;
							border-radius: 3px;
							font-weight: 600;
							text-decoration: none;
							font-size: 16px;
						}

						a:hover {
							background-color: #71349D;
						}
					}

				}

				.notifications.not-logined {
					.list {
						display: none
					}

					.see-all {
						display: none
					}

					.text-center {
						display: none;
					}

					.please-login {
						display: block;
					}

					.no-content-error {
						display: none;
					}
				}

				.favorites {
					width: 100%;
					height: calc(100% - 24px);
					margin-top: 24px;
					float: left;

					.list {
						width: 100%;
						height: calc(100% - 130px);
						float: left;
						overflow-y: scroll;

						.item {
							width: calc(100% - 9px);
							height: 132px;
							padding: 18px;
							border-radius: 10px;
							float: left;
							margin-bottom: 18px;
							background-color: #FCFCFF;
							border: 1px solid #F5F5F5;

							.photo {
								width: 96px;
								height: 96px;
								float: left;

								.image {
									width: 100%;
									height: 100%;
									float: left;

									img {
										width: 100%;
										height: 100%;
										object-fit: cover;
										text-align: center;
										border-radius: 10px;
									}
								}

								.like {
									width: 100%;
									height: 18px;
									margin-top: -90px;
									float: left;
									display: flex;
									align-items: center;

									span {
										margin-left: 6px;
										color: @danger-default;
										font-size: 18px;
									}
								}
							}

							.right {
								width: calc(100% - 106px);
								margin-left: 10px;
								float: left;
								height: 100%;

								.hood {
									width: 100%;
									height: 26px;
									float: left;
									display: flex;
									align-items: center;

									a {
										color: @primary-dark-800;
										text-decoration: none;
										font-weight: 600;
										font-size: 16px;
									}
								}

								.adress {
									width: 100%;
									height: 24px;
									float: left;
									display: flex;
									align-items: center;

									span {
										color: @gray-secondary;
										font-size: 12px;

									}
								}

								.price {
									width: 100%;
									height: 23px;
									float: left;
									display: flex;
									align-items: center;

									span {
										color: @primary-dark-800;
										font-weight: 600;
										font-size: 14px;
									}
								}

								.bot {
									width: 100%;
									height: 23px;
									float: left;

									.info {
										width: calc(100% - 40px);
										height: 23px;
										float: left;
										display: flex;
										align-items: center;

										span {
											font-size: 12px;
										}

										.unpublic {
											color: @danger-hover;
										}
									}

									.action {
										width: 40px;
										height: 30px;
										float: left;
										margin-top: -7px;
										border-bottom: 1px solid #432EB5;

										span {
											font-weight: 600;
											font-size: 14px;
											color: #432EB5;
										}
									}
								}
							}

						}
					}

					/* width */
					.list::-webkit-scrollbar {
						width: 8px !important;
					}

					/* Track */
					.list::-webkit-scrollbar-track {
						background: #E5E5EA;
						border-radius: 120px;
					}

					/* Handle */
					.list::-webkit-scrollbar-thumb {
						background: @main-color-low;
						border-radius: 120px;
					}

					/* Handle on hover */
					.list::-webkit-scrollbar-thumb:hover {
						background: @primary-hover-600;
					}

					.see-all {
						width: 100%;
						height: 48px;
						float: left;
						display: flex;
						align-items: center;
						justify-content: right;
						margin-top: 36px;

						a {
							padding: 12px 32px;
							background-color: @main-color-low;
							color: @white-300;
							transition: 0.3s;
							border-radius: 3px;
							font-weight: 600;
							text-decoration: none;
							font-size: 16px;
						}

						a:hover {
							background-color: #71349D;
						}
					}
				}

				.favorites.not-logined {
					.list {
						display: none
					}

					.see-all {
						display: none
					}

					.text-center {
						display: none;
					}

					.please-login {
						display: block;
					}

					.no-content-error {
						display: none;
					}
				}

				.messages {
					width: 100%;
					height: calc(100% - 24px);
					margin-top: 24px;
					float: left;

					.please-login {
						display: block !important
					}

					.top {
						width: 100%;
						height: calc(100% - 24px);
						float: left;
						background-color: #FCFCFF;
						border: 1px solid #F5F5F5;
						border-radius: 10px;
						margin-top: 12px;

						.search {
							width: 100%;
							margin-top: 18px;
							float: left;
							height: 50px;

							.search-box {
								width: calc(100% - 36px);
								height: 50px;
								margin-left: 18px;
								float: left;
								background-color: #FFFFFF;
								border-radius: 8px;
								border: 1px solid #F5F5F5;

								.icon {
									width: 36px;
									height: 50px;
									float: left;
									display: flex;
									align-items: center;
									justify-content: right;

									span {
										font-size: 20px;
										color: @primary-default-500;
									}
								}

								.input {
									width: calc(100% - 36px);
									height: 50px;
									float: left;

									input {
										width: 100%;
										height: 50px;
										background-color: transparent;
										border: 0px;
										outline: 0px;
										color: #333;
										padding-right: 8px;
										padding-left: 8px;
										font-size: 14px;
									}

									input::placeholder {
										/* Chrome, Firefox, Opera, Safari 10.1+ */
										color: #7A7A7A;
										opacity: 1;
										/* Firefox */
									}

									input:-ms-input-placeholder {
										/* Internet Explorer 10-11 */
										color: #7A7A7A;
									}

									input::-ms-input-placeholder {
										/* Microsoft Edge */
										color: #7A7A7A;
									}
								}
							}
						}

						.list {
							width: calc(100% - 36px);
							margin-left: 18px;
							height: calc(100% - 86px);
							float: left;
							overflow-y: scroll;

							.item {
								width: calc(100% - 10px);
								height: 70px;
								float: left;
								padding: 12px;
								margin-top: 8px;
								background-color: white;
								cursor: pointer;
								border: 1px solid #F5F5F5;
								border-radius: 5px;

								.left {
									width: 47px;
									height: 47px;
									float: left;

									img {
										width: 100%;
										height: 100%;
										object-fit: cover;
										text-align: center;
									}
								}

								.center {
									width: calc(100% - 148px);
									height: 100%;
									float: left;
									margin-left: 14px;

									.username {
										width: 100%;
										height: 24px;
										float: left;
										display: flex;
										align-items: center;

										span {
											color: #252B5C;
											font-weight: 500;
											font-size: 14px;
										}
									}

									.text {
										width: 100%;
										height: 18px;
										float: left;
										display: flex;
										margin-top: 8px;
										align-items: center;

										p {
											font-size: 12px;
											color: #252B5C;
										}
									}
								}

								.right {
									width: 83px;
									height: 100%;
									float: left;

									.date {
										width: 100%;
										height: 16px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: right;

										span {
											font-size: 12px;
											font-weight: 300;
											color: #A1A5C1;
										}
									}

									.bubble {
										width: 100%;
										height: 15px;
										margin-top: 9px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: right;

										span {
											padding: 1px 5px;
											color: white;
											background-color: #36B35A;
											font-size: 8px;
											border-radius: 100%;
										}
									}
								}
							}
						}

						/* width */
						.list::-webkit-scrollbar {
							width: 8px;
						}

						/* Track */
						.list::-webkit-scrollbar-track {
							background: #E5E5EA;
						}

						/* Handle */
						.list::-webkit-scrollbar-thumb {
							background: @primary-default-500;
						}

						/* Handle on hover */
						.list::-webkit-scrollbar-thumb:hover {
							background: @primary-hover-600;
						}
					}

					.viewer {
						display: none;
						width: 100%;
						height: calc(100% - 24px);
						float: left;
						margin-top: 12px;
						background-color: #FCFCFF;
						border-radius: 10px;
						border: 1px solid #F5F5F5;

						.user-info {
							width: calc(100% - 36px);
							height: 70px;
							float: left;
							margin-left: 18px;
							padding: 12px;
							margin-top: 18px;
							background-color: white;
							border: 1px solid #F5F5F5;
							border-radius: 5px;

							.image {
								width: 47px;
								height: 47px;
								float: left;

								img {
									width: 100%;
									height: 100%;
									object-fit: cover;
									text-align: center;
								}
							}

							.center {
								width: calc(100% - 114px);
								height: 100%;
								float: left;
								margin-left: 14px;

								.name {
									width: 100%;
									height: 24px;
									float: left;
									display: flex;
									align-items: center;

									span {
										color: #252B5C;
										font-weight: 500;
										font-size: 16px;
									}
								}

								.statement {
									width: 100%;
									height: 18px;
									float: left;
									display: flex;
									margin-top: 8px;
									align-items: center;

									p {
										font-size: 12px;
										color: #252B5C;
									}
								}
							}

							.right {
								width: 53px;
								height: 100%;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;

								cursor: pointer;

								.messageClose {
									font-size: 18px;
								}

								.date {
									width: 100%;
									height: 16px;
									float: left;
									display: flex;
									align-items: center;
									justify-content: right;

									span {
										font-size: 12px;
										font-weight: 300;
										color: #A1A5C1;
									}
								}

								.bubble {
									width: 100%;
									height: 15px;
									margin-top: 9px;
									float: left;
									display: flex;
									align-items: center;
									justify-content: right;

									span {
										padding: 1px 5px;
										color: white;
										background-color: #36B35A;
										font-size: 8px;
										border-radius: 100%;
									}
								}
							}
						}

						.list {
							width: calc(100% - 36px);
							height: calc(100% - 147px);
							float: left;
							// margin-left: 18px;
							overflow-y: scroll;
							margin-top: 7px;
							overflow-x: hidden;

							.load-more-message {
								display: flex;
								justify-content: center;
								width: 100%;
								text-align: center;
								font-size: 15px;
								color: @primary-default-500;
								cursor: pointer;
								font-weight: 500;
							}

							.item {
								width: 100%;
								height: auto;
								float: left;
								margin-top: 18px;

								.item-container {
									width: 90%;
									height: auto;
									float: left;
									max-width: 295.25px;
									margin-left: 15px;

									.text {
										width: 100%;
										height: auto;
										float: left;
										background-color: @secondary-light-100;
										padding: 14px;
										position: relative;
										border-radius: 16px;
										border-bottom-left-radius: 0;

										p {
											font-weight: 500;
											font-size: 12px;
											margin-bottom: 0;

										}
									}

									.text::before {
										content: '';
										display: inline-block;
										position: absolute;
										bottom: 0;
										left: 0;
										border-top: 30px solid transparent;
										/* yüksekliği ayarlayın */
										border-right: 9px solid @secondary-light-100;
										/* sağ kenar rengi ve uzunluğu ayarlayın */
										border-left: 10px solid transparent;
										/* yüksekliği ayarlayın */
										transform: translateX(-100%);
										/* içeriye doğru kavisli olması için eğim ayarlayın */
									}

									.text::after {
										content: '';
										display: inline-block;
										width: 15px;
										height: 30px;
										border-radius: 15px;
										background-color: #FCFCFF;
										position: absolute;
										bottom: 2px;
										left: 0;
										transform: translateX(-100%);
									}

									.date {
										width: 100%;
										height: 14px;
										float: left;
										margin-top: 8px;
										display: flex;
										align-items: center;
										justify-content: right;

										span {
											font-size: 12px;
											color: #8A9099;
											margin-right: 5px;
										}
									}
								}
							}

							.by {
								.item-container {
									float: right;
									margin-right: 20px;
								}

								.date {
									justify-content: left !important;

									span {
										margin-left: 5px;
										margin-right: 0;
									}
								}

								.text {
									border-bottom-left-radius: 16px !important;
									border-bottom-right-radius: 0 !important;
									position: relative;
									background-color: #96D229 !important;

									p {
										color: white;
									}
								}

								.text::before {
									content: '';
									display: inline-block !important;
									position: absolute !important;
									bottom: 0 !important;
									right: 0 !important;
									border-top: 30px solid transparent !important;
									/* yüksekliği ayarlayın */
									border-right: 9px solid #96D229 !important;
									/* sağ kenar rengi ve uzunluğu ayarlayın */
									border-left: 10px solid transparent !important;
									/* yüksekliği ayarlayın */
									transform: rotateY(180deg) translateX(-100%) !important;
									/* içeriye doğru kavisli olması için eğim ayarlayın */
								}

								.text::after {
									content: '' !important;
									display: inline-block !important;
									width: 15px !important;
									height: 30px !important;
									border-radius: 15px !important;
									background-color: #FCFCFF !important;
									position: absolute !important;
									bottom: 2px !important;
									right: 0 !important;
									left: unset !important;
									transform: translateX(100%) !important;
								}
							}
						}

						/* width */
						.list::-webkit-scrollbar {
							width: 8px;
							border-radius: 8px;
						}

						/* Track */
						.list::-webkit-scrollbar-track {
							background: #E5E5EA;
						}

						/* Handle */
						.list::-webkit-scrollbar-thumb {
							background: @primary-default-500;
							border-radius: 8px;
						}

						/* Handle on hover */
						.list::-webkit-scrollbar-thumb:hover {
							background: @primary-hover-600;
						}

						.form {
							width: 100%;
							height: 52px;
							float: left;
							border-radius: 0px 0px 10px 10px;
							background-color: white;
							border: 1px solid 3F6F6F6;

							.left {
								width: 62.5px;
								height: 52px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;

								span {
									font-size: 30px;
									color: @primary-hover-600;
								}
							}

							.center {
								width: calc(100% - 125px);
								height: 52px;
								float: left;

								input {
									width: 100%;
									height: 33px;
									margin-top: 9.5px;
									border-radius: 4px;
									background-color: #F7F7FC;
									color: #121212;
									font-size: 14px;
									border: 0px;
									padding-left: 8px;
									padding-right: 8px;
									outline: 0px;
								}

								input::placeholder {
									/* Chrome, Firefox, Opera, Safari 10.1+ */
									color: #6F6F6F;
									opacity: 1;
									/* Firefox */
								}

								input:-ms-input-placeholder {
									/* Internet Explorer 10-11 */
									color: #6F6F6F;
								}

								input::-ms-input-placeholder {
									/* Microsoft Edge */
									color: #6F6F6F;
								}
							}

							.send {
								width: 62.5px;
								height: 52px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;
								cursor: pointer;

								span {
									font-size: 20px;
									color: @primary-hover-600;
								}
							}
						}
					}
				}

				.messages.viewing {
					.viewer {
						display: block;
					}

					// .top {height: calc(100% - 494px);}
					.top {
						display: none;
					}
				}
			}

			.opened {
				display: block;
			}
		}

		/* width */
		.content::-webkit-scrollbar {
			width: 0px;
		}
	}
}

.mobile-sidebar {
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 9999999999;
	background: rgba(33, 33, 33, 0.25);
	-webkit-backdrop-filter: blur(15px);
	backdrop-filter: blur(10px);
	top: 0px;
	display: none;
	left: 0px;

	.container {
		width: 80%;
		height: 100%;
		float: left;
		max-width: 276px;
		position: fixed;
		top: 0px;
		left: 0px;
		background-color: @main-color-smooth;
		box-shadow: 0px 0px 8px rgba(34, 34, 34, 0.08);
		border-radius: 0px 10px 10px 0px;
		background-image: url(../assets/images/site/yeni-header-background.png);

		.close {
			width: 100%;
			height: 27px;
			float: left;
			margin-top: 12px;

			.button {
				width: 27px;
				height: 27px;
				float: right;
				margin: 0;
				padding: 0;
				margin-right: 12px;
				display: flex;
				align-items: center;
				justify-content: center;
				background-color: transparent;

				span {
					font-size: 20px;
					color: #fff;
				}
			}
		}

		.logo {
			width: 100%;
			height: 19px;
			margin-top: 21px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;

			img {
				height: 19px;
			}
		}

		.menu {
			width: 100%;
			height: calc(100% - 150px);
			float: left;
			margin-top: 50px;
			overflow-y: scroll;

			.menu-container {
				width: calc(100% - 40px);
				height: auto;
				float: left;
				margin-left: 20px;

				.item {
					width: 100%;
					height: auto;
					float: left;
					margin-top: 3px;
					border-radius: 8px;

					.inner {
						width: 100%;
						height: 48px;
						float: left;

						.icon {
							width: 24px;
							height: 24px;
							float: left;
							margin-left: 16px;
							margin-top: 12px;
							display: flex;
							align-items: center;
							justify-content: center;
						}

						.value {
							width: auto;
							height: 24px;
							margin-top: 12px;
							margin-left: 12px;
							float: left;
							display: flex;
							align-items: center;

							span {
								font-size: 14px;
								font-family: 'Inter';
								color: #FFF;
							}
						}

						.chevron {
							width: 20px;
							height: 20px;
							float: right;
							display: flex;
							align-items: center;
							justify-content: center;
							margin-right: 12px;
							margin-top: 14px;

							span {
								color: #8080A4;
								font-size: 12px;
							}
						}
					}

					.opened {
						width: 100%;
						height: auto;
						float: left;
						display: none;
						padding-bottom: 10px;

						.opened-container {
							width: 100%;
							height: auto;
							float: left;
							padding-left: 40px;

							.item {
								width: 100%;
								height: 36px;
								float: left;
								display: flex;
								align-items: center;

								a {
									font-family: 'Inter';
									font-size: 13px;
									color: #7373AC;
									font-weight: 500;
								}
							}
						}
					}

				}

				.active {
					background-color: #F5FCD2;

					span {
						color: @main-color !important;
						font-weight: 600;
					}
				}

			}
		}

		/* width */
		.menu::-webkit-scrollbar {
			width: 2px;
		}

		/* Track */
		.menu::-webkit-scrollbar-track {
			background: #f1f1f1;
		}

		/* Handle */
		.menu::-webkit-scrollbar-thumb {
			background: #888;
		}

		/* Handle on hover */
		.menu::-webkit-scrollbar-thumb:hover {
			background: #555;
		}

	}
}

.main {
	width: calc(100% - 774px);
	margin-left: 329px;
	float: left;
	font-family: 'Inter';

	.container {
		width: 100%;
		height: auto;
		float: left;
		padding: 0;
		max-width: 100%;

		.main-container {
			width: 100%;
			height: auto;
			float: left;
			display: flex;
			justify-content: center;

			.main-inner {
				width: 100%;
				height: auto;
				float: left;
			}
		}

		.banner {
			width: 100%;
			height: 350px;
			float: left;

			.banner-container {
				width: 100%;
				height: 293px;
				float: left;
				background-image: url(../images/banner-background.webp);
				background-size: 100% 100%;
				background-repeat: no-repeat;
				border-radius: 10px;

				.background-linear {
					width: 100%;
					height: 293px;
					float: left;
					border-radius: 10px;
					background: linear-gradient(266.12deg, rgba(121, 80, 151, 0) 6.71%, rgba(32, 32, 33, 0.3) 39.42%);

				}

				.banner-marginer {
					width: 100%;
					height: auto;
					float: left;
					margin-top: -293px;

					.mobile-top-side {
						width: 100%;
						height: 25px;
						float: left;
						margin-top: 20px;
						padding-left: 20px;
						padding-right: 20px;

						.left {
							width: 25px;
							height: 25px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: center;
						}

						.right {
							width: 58px;
							height: 25px;
							float: right;

							.messages {
								float: left;
								width: 25px;
								height: 25px;
								display: flex;
								align-items: center;
								justify-content: center;
							}

							.notifications {
								width: 25px;
								height: 25px;
								float: left;
								margin-left: 8px;
								display: flex;
								align-items: center;
								justify-content: center;
							}
						}
					}

					.banner-top {
						width: 100%;
						height: 48px;
						float: left;
						padding-left: 20px;
						margin-top: 24px;
						padding-right: 20px;

						.side-opener {
							width: 42px;
							height: 48px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: center;

							span {
								color: white;
								font-size: 24px;
							}
						}

						.hi-text {
							width: calc(100% - 74px);
							height: 48px;
							float: left;
							display: flex;
							align-items: center;

							span {
								color: #FFDD57;
								font-weight: 500;
								font-size: 16px;
							}
						}

						.opener {
							width: 32px;
							height: 48px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: right;

							span {
								color: white;
								font-size: 22px;
							}
						}
					}

					.top-side {
						width: 100%;
						height: 168px;
						float: left;

						.menu {
							width: 352px;
							height: 72px;
							border-radius: 10px;
							padding-left: 15px;
							padding-right: 15px;
							border: 1px solid #F5F5F5;
							float: left;
							background-color: white;
							margin-top: 10px;
							display: none;

							.item {
								width: calc(25% - 15.75px);
								height: 52px;
								float: left;
								margin-top: 10px;
								margin-left: 21px;
								border-radius: 12px;
								transition: 0.3s;
								cursor: pointer;

								.icon {
									width: 100%;
									height: 100%;
									float: left;
									display: flex;
									align-items: center;
									justify-content: center;

									span {
										font-size: 24px;
										color: @main-color-low;
									}
								}
							}

							.active {
								background-color: #A6B8FA;

								.icon span {
									color: black;
								}
							}

							.item:first-child {
								margin-left: 0;
							}

							.item:hover {
								background-color: #EEE;
							}

							.active:hover {
								background-color: @main-color-low;

								.icon span {
									color: white;
								}
							}
						}
					}

					.title {
						width: calc(100% - 359px);
						height: 120px;
						float: left;
						display: flex;
						margin-top: 50px;
						padding-right: 14px;
						align-items: center;

						span {
							line-height: 150%;
							font-size: 40px;
							font-weight: 500;
							color: #F5F5F5;
							padding-left: 64px;
						}
					}

					.form {
						width: 100%;
						height: 160px;
						float: left;
						margin-top: 20px;

						.form-container {
							width: calc(100% - 130px);
							height: 160px;
							float: left;
							margin-left: 65px;
							background-color: white;
							border-radius: 10px;
							padding: 24px;

							.left {
								width: 161px;
								height: 112px;
								float: left;
								margin-left: 2px;

								.item {
									width: 100%;
									height: 50px;
									float: left;
									margin-top: 12px;

									select {
										width: 100%;
										height: 50px;
										background-color: #FAFAFA;
										border-radius: 8px;
										border: 0px;
										color: #6E7191;
										font-size: 14px;
										font-family: 'Inter';
										padding-left: 20px;
										padding-right: 20px;
									}
								}

								.item:first-child {
									margin-top: 0;
								}
							}

							.center-left {
								width: calc(100% - 494px);
								height: 112px;
								float: left;
								padding-left: 16px;
								padding-right: 16px;

								.top {
									width: 100%;
									height: 50px;
									float: left;
									background-color: #FAFAFA;
									border-radius: 8px;

									.icon {
										width: 36px;
										height: 50px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: right;

										span {
											font-size: 20px;
											color: @primary-default-500;
										}
									}

									.input {
										width: calc(100% - 36px);
										height: 50px;
										float: left;

										input {
											width: 100%;
											height: 50px;
											background-color: transparent;
											border: 0;
											outline: 0;
											color: #666;
											font-size: 14px;
											padding-left: 8px;
											padding-right: 8px;
										}

										input::placeholder {
											/* Chrome, Firefox, Opera, Safari 10.1+ */
											color: #7A7A7A;
											opacity: 1;
											/* Firefox */
										}

										input:-ms-input-placeholder {
											/* Internet Explorer 10-11 */
											color: #7A7A7A;
										}

										input::-ms-input-placeholder {
											/* Microsoft Edge */
											color: #7A7A7A;
										}
									}
								}

								.range {
									width: 100%;
									margin-top: 25px;
									height: auto;
									float: left;
								}
							}

							.center-right {
								width: 160px;
								height: 112px;
								float: left;
								margin-left: 2px;

								.item {
									width: 100%;
									height: 50px;
									float: left;
									margin-top: 12px;

									select {
										width: 100%;
										height: 50px;
										background-color: #FAFAFA;
										border-radius: 8px;
										border: 0px;
										color: #6E7191;
										font-size: 14px;
										font-family: 'Inter';
										padding-left: 20px;
										padding-right: 20px;
									}
								}

								.item:first-child {
									margin-top: 0;
								}
							}

							.right {
								width: 146px;
								height: 112px;
								float: left;
								margin-left: 23px;

								.counter {
									width: 100%;
									height: 54px;
									float: left;

									.value {
										width: 100%;
										height: 30px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: center;

										span {
											font-weight: 500;
											font-size: 20px;
											color: @black-100;
										}
									}

									.info {
										width: 100%;
										height: 24px;
										float: left;
										display: flex;
										align-items: center;
										justify-content: center;

										span {
											font-weight: 400;
											font-size: 16px;
											color: @black-100;
										}
									}
								}

								.submit {
									width: 100%;
									height: 40px;
									float: left;
									margin-top: 19px;

									button {
										background-color: @main-color-extra-dark;
										color: white;
										border-radius: 8px;
										border: 0px;
										cursor: pointer;
										width: 100%;
										height: 40px;
										transition: 0.3s;
										font-weight: 600;
										font-size: 16px;
									}

									button:hover {
										background-color: @primary-default-500;
									}

									button:active {
										border: 2px;
										border-color: black;
									}
								}
							}

						}
					}

					.small-form {
						width: calc(100% - 32px);
						height: 368px;
						float: left;
						background-color: white;
						border-radius: 10px;
						border: 1px solid #F5F5F5;
						margin-top: 16px;
						margin-left: 16px;
						box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);

						.small-form-container {
							width: 100%;
							height: 100%;
							float: left;
							padding: 12px;

							.search-box {
								width: 100%;
								height: 48px;
								float: left;
								background-color: #FAFAFA;
								border-radius: 8px;

								.icon {
									width: 32px;
									height: 48px;
									float: left;
									display: flex;
									align-items: center;
									justify-content: center;

									span {
										font-size: 16px;
										color: @main-color;
									}
								}

								.input {
									width: calc(100% - 32px);
									height: 48px;
									float: left;

									input {
										width: 100%;
										height: 48px;
										background-color: transparent;
										border: 0px;
										font-size: 12px;
										outline: 0px;
										padding-left: 8px;
										padding-right: 8px;
										color: #8080A4;
									}
								}
							}

							.select-item {
								width: 100%;
								height: 48px;
								float: left;
								margin-top: 8px;

								select {
									width: 100%;
									height: 48px;
									background-color: #FAFAFA;
									border-radius: 8px;
									padding-left: 20px;
									padding-right: 20px;
									font-size: 12px;
									border: 0px;
									outline: 0px;
									color: #6E7191;
								}
							}

							.submit {
								width: 100%;
								height: 48px;
								float: left;
								margin-top: 12px;

								button {
									width: 100%;
									height: 48px;
									border: 0px;
									border-radius: 3px;
									background-color: @main-color;
									color: white;
									font-weight: 600;
									font-size: 16px;
									transition: 0.3s;
								}

								button:hover {
									background-color: @primary-hover-600;
								}
							}
						}
					}
				}
			}
		}

		section.shortcuts {
			width: 100%;
			height: 58px;
			float: left;
			margin-top: 36px;

			.shortcuts-container {
				width: 100%;
				height: 56px;
				display: flex;
				align-items: center;
				justify-content: space-between;
				gap: 5px;
				padding-top: 6px;
				white-space: nowrap;
				overflow-x: scroll;
				overflow-y: hidden;

				.item {
					width: auto;
					height: 48px;
					margin-top: 13px;
					display: inline-block;

					//    margin-left: 22px;
					a {
						padding: 12px 24px;
						background-color: #FFFFFF;
						border: 1px solid #B49DFE;
						border-radius: 4px;
						font-size: 16px;
						color: @black-100;
						text-decoration: none;
						transition: 0.3s;
					}

					a:hover {
						background-color: #F7F7f7;
					}
				}

				// .item:first-child {margin-left: 0;}
			}

			/* width */
			.shortcuts-container::-webkit-scrollbar {
				height: 4px;
			}

			/* Track */
			.shortcuts-container::-webkit-scrollbar-track {
				background: #f1f1f1;
			}

			/* Handle */
			.shortcuts-container::-webkit-scrollbar-thumb {
				background: #888;
			}

			/* Handle on hover */
			.shortcuts-container::-webkit-scrollbar-thumb:hover {
				background: #555;
			}
		}

		section.popular-states {
			width: 100%;
			height: 220px;
			float: left;
			margin-top: 36px;

			.section-container {
				width: 100%;
				height: 228px;
				float: left;

				.top {
					width: 100%;
					height: 48px;
					float: left;

					.title {
						width: calc(100% - 110px);
						height: 36px;
						float: left;
						display: flex;
						align-items: center;

						span {
							font-weight: 600;
							font-size: 24px;
							color: black;
						}
					}

					.buttons {
						width: 96px;
						height: 40px;
						margin-top: 8px;
						float: left;

						.item {
							width: 40px;
							height: 40px;
							float: left;

							.item-outer {
								width: 40px;
								height: 40px;
								border-radius: 40px;
								float: left;
								background-color: @primary-light-100;
								justify-content: center;

								span {
									width: 28px;
									height: 28px;
									margin: 6px;
									border-radius: 28px;
									color: #7D6494;
									display: flex;
									cursor: pointer;
									align-items: center;
									justify-content: center;
									font-size: 24px;
									border: 0px;
									outline: 0px;
									transition: all .2s ease;
								}
							}

							.active {
								span {
									background-color: @main-color-dark;
									color: white;
								}
							}
						}

						.item:last-child {
							margin-left: 16px;
						}

						.item:hover {
							span {
								background-color: @main-color-dark;
								color: white;
							}
						}
					}
				}

				.list {
					width: 100%;
					height: 148px;
					float: left;

					.list-container {
						width: 100%;
						margin-top: 24px;
						height: 156px;
						float: left;
						overflow-x: scroll;
						white-space: nowrap;

						.item {
							width: 264px;
							height: 143px;
							display: inline-block;
							border-radius: 10px;

							.image {
								width: 100%;
								height: 143px;
								float: left;

								img {
									width: 100%;
									height: 143px;
									object-fit: cover;
									text-align: center;
									border-radius: 10px;
								}
							}

							.title {
								width: 100%;
								height: 45px;
								float: left;
								margin-top: -45px;
								border-radius: 10px;
								background: rgba(255, 255, 255, 0.8);

								display: flex;
								align-items: center;
								justify-content: center;

								span {
									font-weight: 600;
									font-size: 16px;
									color: #655656;
								}
							}
						}

						a {
							margin-left: 24px;
						}

						a:first-child {
							margin-left: 0;
						}

					}

					/* width */
					.list-container::-webkit-scrollbar {
						height: 0px;
					}

					/* Track */
					.list-container::-webkit-scrollbar-track {
						background: #f1f1f1;
					}

					/* Handle */
					.list-container::-webkit-scrollbar-thumb {
						background: #888;
					}

					/* Handle on hover */
					.list-container::-webkit-scrollbar-thumb:hover {
						background: #555;
					}
				}

			}
		}

		.properties {
			width: 100%;
			margin-top: 32px;
			height: 315px;
			float: left;

			.section-container {
				width: 100%;
				height: 100%;
				float: left;

				.list {
					width: 100%;
					height: 100%;
					float: left;

					.item {
						width: calc(25% - 18px);
						height: 315px;
						float: left;
						margin-left: 24px;
						border-radius: 10px;
						background-color: white;

						.item-container {
							width: 100%;
							height: 100%;
							float: left;
							padding: 24px;

							.soon-text {
								width: 100%;
								height: 17px;
								float: left;
								display: flex;
								margin-top: -20px;
								justify-content: right;
								align-items: center;

								span {
									font-weight: 600;
									font-size: 11px;
								}
							}

							.icon {
								width: 100%;
								height: 85px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;

								img {
									max-width: 90%;
								}
							}

							.title {
								width: 100%;
								height: 30px;
								float: left;
								margin-top: 20px;
								display: flex;
								align-items: center;
								justify-content: center;

								span {
									font-weight: 700;
									font-size: 20px;
									color: @primary-dark-800;
									text-align: center;

								}
							}

							.info {
								width: 100%;
								height: 69px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;
								margin-top: 12px;

								p {
									color: #545569;
									font-size: 16px;
									text-align: center;
								}
							}

							.button {
								width: 100%;
								height: 48px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;

								a {
									display: flex;
									align-items: center;
									justify-content: center;
									width: 100%;
									height: 48px;
									float: left;
									text-decoration: none;
								}

								button {
									width: 100%;
									height: 48px;
									background-color: @main-color-dark;
									color: @white-300;
									border-radius: 3px;
									border: 0px;
									font-weight: 600;
									font-size: 16px;
								}
							}
						}
					}

					.item:first-child {
						margin-left: 0;
					}
				}
			}
		}

		section.featured {
			width: 100%;
			height: 500px;
			float: left;
			margin-top: 36px;

			.section-container {
				width: 100%;
				height: 100%;
				float: left;

				.top {
					width: 100%;
					height: 48px;
					float: left;

					.title {
						width: calc(100% - 117px);
						height: 36px;
						float: left;
						display: flex;
						align-items: center;

						span {
							font-weight: 600;
							font-size: 24px;
							color: black;
						}
					}

					.buttons {
						width: 96px;
						height: 40px;
						margin-top: 8px;
						float: left;

						.item {
							width: 40px;
							height: 40px;
							float: left;

							.item-outer {
								width: 40px;
								height: 40px;
								border-radius: 40px;
								float: left;
								background-color: @primary-light-100;
								justify-content: center;

								span {
									width: 28px;
									height: 28px;
									margin: 6px;
									border-radius: 28px;
									color: #7D6494;
									display: flex;
									cursor: pointer;
									align-items: center;
									justify-content: center;
									font-size: 24px;
									border: 0px;
									outline: 0px;
									transition: all .2s ease;
								}
							}

							.active {
								span {
									background-color: @main-color-dark;
									color: white;
								}
							}
						}

						.item:last-child {
							margin-left: 16px;
						}

						.item:hover span {
							background-color: @main-color-dark;
							color: white;
						}
					}
				}

				.mobile-list {
					width: 100%;
					height: 330px;
					float: left;
					margin-top: 8px;
					background-color: white;

					.tab {
						width: 100%;
						height: 100%;
						float: left;
						display: none;
					}

					.active-tab {
						display: block;
					}

					.list-container {
						width: 100%;
						height: 320px;
						float: left;
						padding-left: 16px;
						padding-right: 16px;

						a {
							display: block;
							width: 100%;
							height: 150px;
							float: left;
						}

						.item {
							width: 100%;
							height: 150px;
							float: left;
							background-color: #FCFCFF;
							border-radius: 10px;
							border: 1px solid #F5F5F5;
							margin-top: 10px;

							.item-container {
								width: 100%;
								height: 100%;
								float: left;

								.top {
									width: 100%;
									height: calc(100% - 32px);
									float: left;
									padding: 10px;
									box-shadow: 0px 0px 6px rgba(34, 34, 34, 0.08);

									.photo {
										width: 122px;
										height: 100%;
										float: left;

										.image {
											width: 100%;
											height: 100%;
											float: left;

											img {
												width: 100%;
												height: 100%;
												object-fit: cover;
												border-radius: 10px;
												text-align: center;
											}
										}

										.actions {
											width: 100%;
											height: 18px;
											float: left;
											margin-top: -86px;

											.like {
												width: 18px;
												height: 18px;
												float: left;
												display: flex;
												align-items: center;
												justify-content: center;
												margin-left: 6px;
												cursor: pointer;

												span {
													color: @danger-default;
													font-size: 18px;
												}
											}

											.slider-selectors {
												width: 36px;
												height: 18px;
												float: right;
												margin-right: 10px;

												.selector {
													width: 12px;
													height: 18px;
													float: left;
													display: flex;
													align-items: center;
													justify-content: center;

													span {
														padding: 0.5px 2px;
														background-color: white;
														border-radius: 100%;
														color: #BCE455;
														font-size: 6px;
													}
												}
											}
										}
									}

									.right {
										width: calc(100% - 122px);
										height: 100%;
										float: left;

										.right-container {
											padding-left: 13px;
											width: 100%;
											float: left;
											height: 100%;

											.hood {
												width: 100%;
												height: 15px;
												float: left;
												display: flex;
												margin-top: 8px;
												align-items: center;

												span {
													font-weight: 600;
													font-size: 10px;
													color: #2D1D92;
													text-decoration: none;
												}
											}

											.location {
												width: 100%;
												height: 12px;
												float: left;
												margin-top: 8px;
												display: flex;
												align-items: center;

												span {
													font-size: 10px;
													color: @gray-secondary;
												}
											}

											.date {
												width: 100%;
												height: 15px;
												float: left;
												display: flex;
												align-items: center;
												margin-top: 8px;

												span {
													font-size: 10px;
													color: @gray-secondary;
												}
											}

											.bottom {
												width: 100%;
												height: 17px;
												float: left;
												margin-top: 12px;

												.selling {
													width: auto;
													height: 17px;
													float: left;
													display: flex;
													align-items: center;

													span {
														color: @secondary-default-500;
														font-weight: 500;
														font-size: 10px;
													}
												}

												.price {
													width: auto;
													height: 17px;
													float: right;
													display: flex;
													align-items: center;

													span {
														font-weight: 600;
														font-size: 12px;
														color: #2D1D92;
													}
												}
											}
										}
									}
								}

								.bot {
									width: 100%;
									height: 32px;
									float: left;

									.properties-s {
										width: 100%;
										height: 32px;
										float: left;
										display: flex;
										justify-content: center;

										.property {
											width: auto;
											height: 32px;
											float: left;
											margin-left: 25px;

											.icon {
												width: 24px;
												height: 32px;
												float: left;
												display: flex;
												align-items: center;
												justify-content: center;

												img {
													width: 15px;
												}
											}

											.value {
												width: auto;
												height: 32px;
												float: left;
												display: flex;
												align-items: center;

												span {
													font-size: 12px;
													font-weight: 500;
													color: #121212;
												}
											}
										}

										.property:first-child {
											margin-left: 0;
										}
									}
								}
							}
						}
					}
				}

				.pagination-s {
					background-color: white;
					margin-top: 0;
					height: 60px;
					padding-top: 14px;
				}

				.list {
					width: 100%;
					margin-top: 24px;
					height: calc(100% - 72px);
					float: left;

					.list-container {
						width: 100%;
						height: 100%;
						float: left;
						padding-right: 24px;
						overflow-x: scroll;
						overflow-y: hidden;
						white-space: nowrap;

						.item {
							width: 359px;
							height: 414px;
							display: inline-block;
							margin-left: 24px;
							background-color: #FFFFFF;
							border: 1px solid #F5F5F5;
							border-radius: 10px;

							.item-container {
								width: 100%;
								height: 100%;
								float: left;

								.photo {
									width: 100%;
									height: 272px;
									float: left;

									.image {
										width: 100%;
										height: 272px;
										float: left;

										img {
											width: 100%;
											height: 272px;
											object-fit: cover;
											text-align: center;
											border-radius: 10px 10px 0px 0px;
										}
									}

									.info-like {
										width: 100%;
										height: 51px;
										margin-top: -272px;
										float: left;

										.info {
											width: auto;
											padding: 0px 12px;
											background-color: white;
											height: 35px;
											float: left;
											border-radius: 10px 0px 7px 0px;

											.icon {
												width: 18px;
												height: 22px;
												float: left;
												margin-top: 6.5px;
												display: flex;
												align-items: center;
												justify-content: center;

												span {
													pointer-events: none;
													color: @main-color-dark;
													font-size: 18px;
												}
											}

											.text {
												width: auto;
												height: 22px;
												margin-top: 6.5px;
												float: left;
												display: flex;
												align-items: center;
												margin-left: 8px;

												span {
													color: @main-color-dark;
													font-weight: 600;
													font-size: 14px;
												}
											}
										}

										.like {
											width: 40px;
											height: 40px;
											float: right;
											margin-top: 12px;
											margin-right: 12px;
											cursor: pointer;
											transition: all .2s ease;

											span {
												display: flex;
												width: 40px;
												height: 40px;
												align-items: center;
												justify-content: center;
												font-size: 20px;
												color: @danger-default;
												background-color: white;
												border-radius: 40px;
											}
										}

										.like:hover {
											box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
										}
									}
								}

								.properties {
									width: 100%;
									height: 46px;
									float: left;
									margin-top: -46px;
									background-color: rgba(0, 0, 0, 0.5);
									-webkit-backdrop-filter: blur(10px);
									backdrop-filter: blur(10px);
									display: flex;
									align-items: center;
									padding: 0 15px;

									.container {
										width: 100%;
										height: 22px;
										float: left;
										display: flex;
										align-items: center;

										.pp {
											--size: 27px;
											margin-right: 5px;
											width: var(--size);
											height: var(--size);
											min-width: var(--size);
											border-radius: 50%;
											overflow: hidden;
										}

										.pp img {
											width: 100%;
											height: 100%;
											object-fit: cover;
										}

										.properties-container {
											width: 100%;
											height: 100%;
											float: left;

											.inner {
												width: 100%;
												height: 100%;
												float: left;
												display: grid;
												grid-template-columns: repeat(4, 1fr);

												.item {
													width: auto;
													height: 22px;
													float: left;
													background-color: transparent;
													border: 0px;
													box-shadow: none;
													margin-top: 0;
													margin-left: 9px;
													display: flex;
													align-items: center;

													.icon {
														width: auto;
														height: 22px;
														float: left;
														display: flex;
														align-items: center;
													}

													.value {
														width: auto;
														height: 22px;
														float: left;
														display: flex;
														align-items: center;

														span {
															font-size: 14px;
															font-weight: 600;
															margin-left: 5px;
															color: white;
															white-space: nowrap;
														}
													}
												}

												.item:first-child {
													margin-left: 0;
												}

											}
										}

										.slider-selectors {
											width: 46px;
											height: 12px;
											float: left;
											margin-top: 5px;
											margin-left: 8px;

											.item {
												width: 46px;
												height: 12px;
												float: left;
												background-color: transparent;
												box-shadow: none;
												border: 0px;
												margin-top: 0;

												.outer {
													background-color: white;
													width: 12px;
													height: 12px;
													float: left;
													margin-left: 5px;
													border-radius: 12px;

													.inner {
														width: 10px;
														height: 10px;
														border-radius: 10px;
														margin: 1px;
														float: left;
													}

													.active {
														background-color: #BCE455;
													}
												}

												.outer:first-child {
													margin-left: 0;
												}
											}

										}
									}
								}

								.card-title {
									width: 100%;
									height: 24px;
									float: left;
									display: flex;
									align-items: center;
									margin-top: 20px;

									a {
										color: #1F3A43;
										font-weight: 500;
										font-size: 16px;
										text-decoration: none;
										overflow: hidden;
										display: -webkit-box;
										padding: 0 22px;
										-webkit-line-clamp: 1;
										white-space: break-spaces;
										-webkit-box-orient: vertical;
										word-break: break-all;
									}
								}

								.location {
									width: 100%;
									margin-top: 12px;
									float: left;
									height: 24px;
									display: flex;
									align-items: center;

									span {
										padding-left: 24px;
										color: @gray-secondary;
										font-weight: 500;
										font-size: 14px;
									}
								}

								.bottom {
									width: 100%;
									height: 28px;
									float: left;
									margin-top: 10px;

									.date {
										width: auto;
										height: 24px;
										margin-top: 4px;
										float: left;
										display: flex;
										align-items: center;

										span {
											margin-left: 24px;
											font-size: 16px;
											color: #8080A4;
										}
									}

									.price {
										width: auto;
										float: right;
										height: 28px;
										display: flex;
										align-items: center;

										span {
											margin-right: 24px;
											color: @main-color-dark;
											font-weight: 600;
											font-size: 20px;
										}
									}
								}
							}
						}

						.item:first-child {
							margin-left: 0;
						}
					}

					/* width */
					.list-container::-webkit-scrollbar {
						height: 0px;
					}

					/* Track */
					.list-container::-webkit-scrollbar-track {
						background: #f1f1f1;
					}

					/* Handle */
					.list-container::-webkit-scrollbar-thumb {
						background: #888;
					}

					/* Handle on hover */
					.list-container::-webkit-scrollbar-thumb:hover {
						background: #555;
					}
				}
			}
		}

		section.about-corporate {
			width: 100%;
			height: 170px;
			float: left;
			margin-top: 55px;
			background-color: #5E43D8;
			border-radius: 10px;
			background-image: url(../images/about-corporate-background.png);
			background-repeat: no-repeat;
			background-position: right center;

			.section-container {
				width: 100%;
				height: 100%;
				padding-left: 36px;
				padding-right: 36px;
				padding-top: 24px;
				padding-bottom: 24px;

				.left {
					width: calc(100% - 120px);
					height: 100%;
					float: left;

					.title {
						width: 100%;
						height: 34px;
						float: left;
						display: flex;
						align-items: center;

						span {
							font-weight: 600;
							font-size: 24px;
							color: white;
						}
					}

					.info {
						width: 100%;
						height: 70px;
						float: left;
						margin-top: 20px;

						p {
							font-weight: 500;
							font-size: 20px;
							color: White;
						}
					}
				}

				.right {
					width: 120px;
					height: 48px;
					float: left;
					margin-top: 71px;

					a {
						padding: 12px 32px;
						background-color: #9CD323;
						border-radius: 3px;
						font-weight: 600;
						font-size: 16px;
						color: white;
						text-decoration: none;
					}
				}
			}
		}

		section.newest-adverts {
			width: 100%;
			height: 484px;
			float: left;
			margin-top: 36px;

			.section-container {
				width: 100%;
				height: 100%;
				float: left;

				.title {
					width: 100%;
					height: 36px;
					float: left;
					display: flex;
					align-items: center;

					span {
						font-weight: 600;
						font-size: 24px;
						color: black;
					}
				}

				.menu {
					width: 100%;
					border-radius: 12px;
					background-color: #FFFFFF;
					margin-top: 29px;
					float: left;
					height: 65px;

					.menu-container {
						width: 100%;
						height: 60px;
						float: left;
						overflow-x: auto;
						overflow-y: hidden;
						white-space: nowrap;
						display: flex;
						align-items: center;
						gap: 4px;
						padding: 0 10px;

						.item {
							width: auto;
							height: 41px;
							display: inline-block;
							cursor: pointer;
							border-radius: 8px;

							span {
								padding: 14px 53px;
								font-weight: 500;
								font-size: 14px;
								line-height: 41px;
								border-radius: 8px;
								color: #8080A4;
							}
						}

						.item:hover span {
							background-color: #F2F2F2;
						}

						.active {
							span {
								background-color: #CEBEFE !important;
								color: #363636 !important;
							}
						}
					}

					/* width */
					.menu-container::-webkit-scrollbar {
						height: 4px;
					}

					/* Track */
					.menu-container::-webkit-scrollbar-track {
						background: #f1f1f1;
					}

					/* Handle */
					.menu-container::-webkit-scrollbar-thumb {
						background: #888;
					}

					/* Handle on hover */
					.menu-container::-webkit-scrollbar-thumb:hover {
						background: #555;
					}
				}

				.mobile-menu {
					width: 100%;
					height: 64px;
					float: left;
					padding-left: 16px;
					background-color: white;
					padding-right: 16px;
					padding-top: 18px;
					margin-top: 12px;

					select {
						width: 100%;
						height: 46px;
						background-color: #FAFAFA;
						border-radius: 8px;
						border: 1px solid #DBDBDB;
						color: #6E7191;
						font-size: 12px;
						padding-left: 20px;
						padding-right: 20px;
						outline: 0px;
					}
				}

				.mobile-list {
					width: 100%;
					height: 330px;
					float: left;
					margin-top: 8px;
					background-color: white;

					.tab {
						width: 100%;
						height: 100%;
						float: left;
						display: none;
					}

					.active-tab {
						display: block;
					}

					.list-container {
						width: 100%;
						height: 320px;
						float: left;
						padding-left: 16px;
						padding-right: 16px;

						a {
							display: block;
							width: 100%;
							height: 150px;
						}

						.item {
							width: 100%;
							height: 150px;
							float: left;
							background-color: #FCFCFF;
							border-radius: 10px;
							border: 1px solid #F5F5F5;
							margin-top: 10px;

							.item-container {
								width: 100%;
								height: 100%;
								float: left;

								.top {
									width: 100%;
									height: calc(100% - 32px);
									float: left;
									padding: 10px;
									box-shadow: 0px 0px 6px rgba(34, 34, 34, 0.08);

									.photo {
										width: 122px;
										height: 100%;
										float: left;

										.image {
											width: 100%;
											height: 100%;
											float: left;

											img {
												width: 100%;
												height: 100%;
												object-fit: cover;
												border-radius: 10px;
												text-align: center;
											}
										}

										.actions {
											width: 100%;
											height: 18px;
											float: left;
											margin-top: -86px;

											.like {
												width: 18px;
												height: 18px;
												float: left;
												display: flex;
												align-items: center;
												justify-content: center;
												margin-left: 6px;

												span {
													color: @danger-default;
													font-size: 18px;
												}
											}

											.slider-selectors {
												width: 36px;
												height: 18px;
												float: right;
												margin-right: 10px;

												.selector {
													width: 12px;
													height: 18px;
													float: left;
													display: flex;
													align-items: center;
													justify-content: center;

													span {
														padding: 0.5px 2px;
														background-color: white;
														border-radius: 100%;
														color: #BCE455;
														font-size: 6px;
													}
												}
											}
										}
									}

									.right {
										width: calc(100% - 122px);
										height: 100%;
										float: left;

										.right-container {
											padding-left: 13px;
											width: 100%;
											float: left;
											height: 100%;

											.hood {
												width: 100%;
												height: 15px;
												float: left;
												display: flex;
												margin-top: 8px;
												align-items: center;

												span {
													font-weight: 600;
													font-size: 10px;
													color: #2D1D92;
													text-decoration: none;
												}
											}

											.location {
												width: 100%;
												height: 12px;
												float: left;
												margin-top: 8px;
												display: flex;
												align-items: center;

												span {
													font-size: 10px;
													color: @gray-secondary;
												}
											}

											.date {
												width: 100%;
												height: 15px;
												float: left;
												display: flex;
												align-items: center;
												margin-top: 8px;

												span {
													font-size: 10px;
													color: @gray-secondary;
												}
											}

											.bottom {
												width: 100%;
												height: 17px;
												float: left;
												margin-top: 12px;

												.selling {
													width: auto;
													height: 17px;
													float: left;
													display: flex;
													align-items: center;

													span {
														color: @secondary-default-500;
														font-weight: 500;
														font-size: 10px;
													}
												}

												.price {
													width: auto;
													height: 17px;
													float: right;
													display: flex;
													align-items: center;

													span {
														font-weight: 600;
														font-size: 12px;
														color: #2D1D92;
													}
												}
											}
										}
									}
								}

								.bot {
									width: 100%;
									height: 32px;
									float: left;

									.properties-s {
										width: 100%;
										height: 32px;
										float: left;
										display: flex;
										justify-content: center;

										.property {
											width: auto;
											height: 32px;
											float: left;
											margin-left: 25px;

											.icon {
												width: 24px;
												height: 32px;
												float: left;
												display: flex;
												align-items: center;
												justify-content: center;

												img {
													width: 15px;
												}
											}

											.value {
												width: auto;
												height: 32px;
												float: left;
												display: flex;
												align-items: center;

												span {
													font-size: 12px;
													font-weight: 500;
													color: #121212;
												}
											}
										}

										.property:first-child {
											margin-left: 0;
										}
									}
								}
							}
						}
					}
				}

				.pagination-s {
					background-color: white;
					margin-top: 0;
					height: 60px;
					padding-top: 14px;
				}

				.list {
					width: 100%;
					margin-top: 14px;
					height: calc(100% - -20px);
					float: left;
					background-color: white;
					border-radius: 10px;

					.list-container {
						width: calc(100% - 9px);
						height: calc(100% - 48px);
						margin-top: 24px;
						float: left;
						display: none;

						.item {
							width: calc(50% - 24px);
							height: 138px;
							float: left;
							margin-bottom: 24px;
							background-color: #FCFCFF;
							border: 1px solid #F5F5F5;
							border-radius: 10px;
							margin-left: 24px;

							.item-container {
								width: 100%;
								height: 100%;
								float: left;
								padding: 18px;

								.photo {
									width: 173px;
									height: 102px;
									float: left;

									img {
										width: 100%;
										height: 102px;
										border-radius: 10px;
										object-fit: cover;
										text-align: center;
									}
								}

								.info {
									width: calc(100% - 173px);
									height: 100%;
									float: left;

									.info-container {
										width: 100%;
										padding-left: 18px;
										float: left;
										height: 100%;

										.card-title {
											width: 100%;
											height: 24px;
											float: left;
											display: flex;
											align-items: center;

											a {
												color: #1F3A43;
												font-weight: 500;
												font-size: 16px;
												text-decoration: none;
												display: -webkit-box;
    											-webkit-line-clamp: 1;
   											    -webkit-box-orient: vertical; 
    										    overflow:hidden;

											}
										}

										.location {
											width: 100%;
											height: 24px;
											float: left;
											margin-top: 8px;

											span {
												font-weight: 500;
												font-size: 14px;
												color: #8080A4;
											}
										}

										.bottom {
											width: 100%;
											height: 23px;
											float: left;
											margin-top: 16px;

											.stars {
												width: 128px;
												height: 20px;
												margin-top: 3px;
												float: left;

												.star {
													width: 20%;
													height: 20px;
													float: left;
													display: flex;
													align-items: center;
													justify-content: center;

													span {
														color: #E5E7EB;
														font-size: 18px;
													}
												}

												.active {
													span {
														color: #9CD323;
													}
												}
											}

											.price {
												width: auto;
												float: right;
												height: 23px;
												display: flex;
												align-items: center;

												span {
													font-weight: 600;
													font-size: 16px;
													color: @main-color-dark;
												}
											}
										}
									}
								}
							}
						}
					}

					.list-container.actived {
						display: block;
					}

					/* width */
					.list-container::-webkit-scrollbar {
						width: 8px;
					}

					/* Track */
					.list-container::-webkit-scrollbar-track {
						background: #E5E5EA;
						border-radius: 120px;
					}

					/* Handle */
					.list-container::-webkit-scrollbar-thumb {
						background: @main-color-dark;
						border-radius: 120px;
					}

					/* Handle on hover */
					.list-container::-webkit-scrollbar-thumb:hover {
						background: @primary-hover-600;
					}
				}
			}
		}

		section.news {
			width: 100%;
			height: 600px;
			float: left;
			margin-top: 100px;
			margin-bottom: 100px;

			.section-container {
				width: 100%;
				height: 100%;
				float: left;
				margin-top: 110px;

				.top {
					width: 100%;
					height: 48px;
					float: left;

					.title {
						width: calc(100% - 96px);
						height: 36px;
						float: left;
						display: flex;
						align-items: center;

						span {
							font-weight: 600;
							font-size: 24px;
							color: black;
						}
					}

					.buttons {
						width: 96px;
						height: 40px;
						margin-top: 8px;
						float: left;

						.item {
							width: 40px;
							height: 40px;
							float: left;

							.item-outer {
								width: 40px;
								height: 40px;
								border-radius: 40px;
								float: left;
								background-color: @primary-light-100;
								justify-content: center;

								span {
									width: 28px;
									height: 28px;
									margin: 6px;
									border-radius: 28px;
									color: #7D6494;
									display: flex;
									cursor: pointer;
									align-items: center;
									justify-content: center;
									font-size: 24px;
									border: 0px;
									outline: 0px;
									transition: all .2s ease;
								}
							}

							.active {
								span {
									background-color: @main-color-dark;
									color: white;
								}
							}
						}

						.item:last-child {
							margin-left: 16px;
						}

						.item:hover span {
							background-color: @main-color-dark;
							color: white;
						}
					}
				}

				.list {
					width: 100%;
					margin-top: 18px;
					height: calc(100% - 72px);
					float: left;
					white-space: nowrap;
					overflow-x: scroll;
					overflow-y: hidden;

					.list-container {
						width: 100%;
						height: auto;
						float: left;

						.item {
							width: 361px;
							height: 472px;
							display: inline-block;
							background-color: white;
							border-radius: 10px;
							border: 1px solid #F5F5F5;
							white-space: normal;
							margin-left: 24px;

							.item-container {
								width: 100%;
								height: 100%;
								float: left;
								border-radius: 10px;
								overflow: hidden;

								.photo {
									width: 100%;
									height: 194px;
									float: left;

									img {
										width: 100%;
										height: 194px;
										object-fit: cover;
										text-align: center;
										border-radius: 6px;
									}
								}

								.bottom {
									width: 100%;
									height: 284px;
									float: left;
									margin-top: -30px;
									padding-left: 24px;
									padding-right: 24px;

									.bottom-container {
										width: 100%;
										height: 100%;
										float: left;

										.owner {
											width: 100%;
											height: 60px;
											float: left;

											.outer {
												width: 60px;
												height: 60px;
												float: right;
												background-color: white;
												border-radius: 60px;
												display: flex;
												box-shadow: 0px 15px 25px rgba(13, 15, 31, 0.071);
												align-items: center;
												justify-content: center;
												margin-right: -8px;

												img {
													width: 25px;
												}
											}
										}

										.date {
											width: 100%;
											margin-top: -10px;
											height: 24px;
											float: left;
											display: flex;
											align-items: center;

											span {
												font-size: 16px;
												color: #242424;
											}
										}

										.atitle {
											width: 100%;
											height: 36px;
											float: left;
											display: flex;
											align-items: center;

											span {
												font-weight: 700;
												font-size: 19px;
												color: #1a1344;
												text-decoration: none;
											}
										}

										.explanation {
											width: 100%;
											height: 96px;
											float: left;
											margin-top: 10px;
											display: flex;
											align-items: center;

											p {
												font-size: 16px;
												color: #545569;
												display: -webkit-box;
                                                -webkit-line-clamp: 4;
                                                -webkit-box-orient: vertical; 
                                                overflow:hidden;

											}
										}

										.button {
											width: 100%;
											height: 48px;
											float: left;
											display: flex;
											align-items: center;
											margin-top: 16px;
											justify-content: right;

											span {
												padding: 12px 32px;
												color: @white-300;
												background-color: @main-color;
												border-radius: 3px;
												text-decoration: none;
												font-weight: 600;
											}
										}
									}
								}
							}
						}

						.item:first-child {
							margin-left: 0;
						}
					}
				}

				/* width */
				.list::-webkit-scrollbar {
					height: 0px;
				}

				/* Track */
				.list::-webkit-scrollbar-track {
					background: #f1f1f1;
				}

				/* Handle */
				.list::-webkit-scrollbar-thumb {
					background: #888;
				}

				/* Handle on hover */
				.list::-webkit-scrollbar-thumb:hover {
					background: #555;
				}
			}
		}
	}
}

.kullanici-gizlilik {
	width: calc(100% - 774px);
	margin-left: 329px;
	float: left;
	font-family: 'Inter';
	margin-top: 24px;
	margin-bottom: 100px;

	.container {
		width: 100%;
		height: auto;
		float: left;
		padding-bottom: 100px;
		max-width: 100%;

		.link-us {
			width: 100%;
			height: 22px;
			margin-top: 12px;
			float: left;
			display: flex;
			align-items: center;

		}

		.content {
			width: 100%;
			height: auto;
			float: left;
			padding: 16px;
			padding-top: 48px;
			background-color: white;
			display: block !important;
		}
	}
}


.uyelik-sozlesmesi {
	width: calc(100% - 774px);
	margin-left: 329px;
	float: left;
	font-family: 'Inter';
	margin-top: 24px;
	margin-bottom: 100px;

	.container {
		width: 100%;
		height: auto;
		float: left;
		padding-bottom: 100px;
		max-width: 100%;

		.content {
			width: 100%;
			height: auto;
			float: left;
			padding: 16px;
			padding-top: 48px;
			background-color: white;
		}
	}
}





.mobile-element {
	display: none;

	@media screen and (max-width: 768px) {
		display: block !important;
	}
}

.web-element {
	@media screen and (max-width: 768px) {
		display: none !important;
	}
}

.see-all-top {
	width: 71px;
	height: 100%;
	float: left;
	display: none;
	align-items: center;

	a {
		font-weight: 600;
		font-size: 12px;
		color: #5E43D8;
		border-bottom: 1px solid #5E43D8;
		padding-bottom: 8px;
	}
}

.pagination-s {
	width: 100%;
	height: 32px;
	float: left;
	display: none;
	margin-top: 24px;
	justify-content: center;

	.pagination-s-container {
		width: auto;
		height: 32px;
		float: left;

		.arrow {
			width: 32px;
			height: 32px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;

			span {
				font-size: 16px;
				color: @black-100;
			}
		}

		.p-list {
			width: auto;
			height: 32px;
			float: left;
			margin-left: 12px;
			margin-right: 12px;

			.item {
				width: 32px;
				height: 32px;
				float: left;
				margin-left: 3px;
				margin-right: 3px;

				span {
					font-weight: 500;
					font-size: 14px;
					color: #0A0A0A;
					display: flex;
					align-items: center;
					justify-content: center;
					width: 100%;
					height: 100%;
					border-radius: 8px;
				}
			}

			.active span {
				background-color: @primary-default-500;
				color: white;
			}
		}
	}
}


.small-menu {
	width: 100%;
	height: 74px;
	position: fixed;
	top: 0px;
	left: 0px;
	background-color: white;
	display: none;
	z-index: 99999;
	font-family: 'Inter';

	.menu-container {
		width: 100%;
		height: 74px;
		float: left;

		.logo {
			width: auto;
			height: 74px;
			float: left;
			margin-left: 4%;
			display: flex;
			align-items: center;

			img {
				height: 17.05px;
			}
		}

		.menu {
			width: auto;
			height: 74px;
			float: left;
			margin-left: 30px;

			.menu-inner {
				width: auto;
				height: 74px;
				float: left;

				.item {
					width: auto;
					height: 74px;
					float: left;
					margin-left: 30px;

					.item-container {
						width: auto;
						height: 74px;
						float: left;
						cursor: pointer;

						.text {
							width: auto;
							height: 74px;
							float: left;
							display: flex;
							align-items: center;

							span {
								color: #8080A4;
								font-size: 16px;
							}

							.actived {
								color: #432EB5;
								font-weight: 600;
							}
						}

						.chevron {
							width: 20px;
							height: 74px;
							float: left;
							display: flex;
							align-items: center;
							justify-content: center;
							margin-left: 0px;

							span {
								color: #8080A4;
								font-size: 14px;
							}
						}
					}

					.dropmenu {
						width: 220px;
						height: auto;
						position: fixed;
						background-color: white;
						padding: 12px;
						top: 54px;
						border: 1px solid #aaa;
						display: none;

						.drop-container {
							width: 100%;
							height: auto;
							float: left;

							.drop-item {
								width: 100%;
								height: 32px;
								float: left;

								a {
									display: flex;
									width: 100%;
									height: 32px;
									align-items: center;
									padding-left: 12px;
									font-size: 16px;
									font-weight: 500;
									text-decoration: none;
									color: black;
								}
							}
						}
					}
				}
			}
		}

		.user {
			width: auto;
			height: 74px;
			float: right;
			display: flex;
			align-items: center;

			.not-logined {
				button {
					width: 79px;
					height: 34px;
					background-color: @main-color;
					font-size: 11px;
					color: white;
					border: 0px;
					border-radius: 8px;
					margin-right: 13px;
				}
			}

			.logined {
				width: 79px;
				margin-right: 13px;
				height: 74px;
				float: right;
				display: flex;
				align-items: center;

				.logined-user {
					width: 100%;
					height: 34px;
					float: left;
					background-color: @main-color;
					border-radius: 5px;

					.logout {
						width: 39px;
						height: 34px;
						display: flex;
						align-items: center;
						justify-content: center;
						float: left;

						img {
							width: 24px;
						}
					}

					.user-photo {
						width: 40px;
						height: 34px;
						float: left;
						display: flex;
						justify-content: right;
						align-items: center;

						img {
							width: 30px;
							height: 30px;
							border-radius: 5px;
							object-fit: cover;
							margin-right: 2px;
							text-align: center;
						}
					}
				}
			}

		}
	}
}



.mobile-container-for-left .mobile-container-for-left-side-menu {
	display: none;
}

.mobile-container-for-left .mobile-container-for-left-side-back {
	display: none;
}

.mobile-container-for-left.opened {
	width: 100%;
	height: 100%;
	float: left;
	position: fixed;
	background-color: @main-color;

	.mobile-bot {
		display: none;
	}

	.mobile-header {
		display: none !important;
	}

	.mobile-container-for-left-side-menu {
		width: 230px;
		height: 90%;
		float: left;
		position: fixed;
		top: 5%;
		display: block;

		.menu-container {
			width: 100%;
			height: 90%;
			padding-left: 20px;
			padding-right: 20px;
			float: left;
			overflow-y: scroll;

			.close {
				width: 100%;
				height: 33.5px;
				float: left;

				span {
					display: flex;
					width: 33.5px;
					height: 33.5px;
					justify-content: center;
					align-items: center;
					border-radius: 8px;
					border: 0.5px solid white;
					color: white;
				}
			}

			.menu-user {
				width: 100%;
				height: auto;
				float: left;
				margin-top: 24px;

				.user-photo {
					width: 67px;
					height: 67px;
					float: left;
					display: flex;
					align-items: center;
					justify-content: center;
					background-image: url('../images/Group 1000003425.png.png');
					background-size: 100% 100%;
					background-repeat: no-repeat;
					background-position: center;

					img {
						width: 60px;
						height: 60px;
						object-fit: cover;
						border-radius: 60px;
					}
				}

				.user-info {
					width: 100%;
					height: auto;
					float: left;

					.user-welcome {
						width: 100%;
						height: 16px;
						float: left;
						display: flex;
						align-items: center;
						margin-top: 13px;

						span {
							color: white;
							font-weight: 500;
							font-size: 12px;
						}
					}

					.user-name {
						width: 100%;
						height: auto;
						float: left;
						margin-top: 3px;

						span {
							color: white;
							font-weight: 700;
							font-size: 16px;
						}
					}
				}
			}

			.menu-list {
				width: 100%;
				height: auto;
				float: left;
				margin-top: 9px;

				.item {
					width: 100%;
					margin-top: 30px;
					height: 22px;
					float: left;

					.item-container {
						width: 100%;
						height: 22px;
						float: left;
					}

					.icon {
						width: 22px;
						height: 22px;
						display: flex;
						align-items: center;
						float: left;
						justify-content: center;
					}

					.text {
						width: calc(100% - 22px);
						height: 22px;
						display: flex;
						float: left;
						align-items: center;
						padding-left: 14px;

						span {
							color: white;
							font-size: 14px;
						}
					}

					.opened {
						width: 100%;
						height: auto;
						display: none;
						float: left;
						margin-top: 0px;

						a {
							width: 100%;
							height: 22px;
							display: block;
							float: left;
							margin-top: 8px;
						}

						.o-item {
							width: 100%;
							height: 22px;
							float: left;

							.o-icon {
								width: 22px;
								height: 22px;
								float: left;
								display: flex;
								align-items: center;
								justify-content: center;

								img {
									width: 16px;
								}
							}

							.o-text {
								width: calc(100% - 22px);
								height: 22px;
								float: left;
								display: flex;
								padding-left: 4px;
								align-items: center;

								span {
									color: white;
									font-size: 13px;
								}
							}
						}

					}
				}

				.item.m-opened {
					height: auto;

					.opened {
						display: block
					}
				}
			}

		}

		/* width */
		.menu-container::-webkit-scrollbar {
			width: 5px;
		}
	}

	.mobile-container-for-left-side-back {
		width: 100%;
		height: 85%;
		top: 7.5%;
		display: block;
		position: fixed;
		left: 206px;
		border-radius: 20px;
		background-color: rgba(255, 255, 255, 0.4);
	}

	.mobile-container-for-left-content {
		width: 100%;
		position: fixed;
		left: 230px;
		height: 90%;
		top: 5%;
		overflow-y: hidden;
		background-color: white;
		border-radius: 20px;

		.main {
			border-radius: 20px;
		}
	}
}





.hesap-messages-error {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 99999999999;
	background-color: rgba(0, 0, 0, 0.8);

	.container {
		width: calc(100% - 20px);
		height: 362px;
		float: left;
		background-color: white;
		padding: 7px;
		border-radius: 8px;

		.close {
			width: 100%;
			height: 20px;
			display: flex;
			align-items: center;
			justify-content: right;

			span {
				display: flex;
				width: 20px;
				height: 20px;
				align-items: center;
				justify-content: center;
				font-size: 17px;
				background-color: #C5C6D3;
				border-radius: 100px;
				color: #6E7191;
			}
		}

		.vector {
			width: 100%;
			height: auto;
			float: left;
			display: flex;
			justify-content: center;
			margin-top: -10px;
		}

		.title {
			width: 100%;
			height: 38px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 10px;

			span {
				text-align: center;
				font-size: 14px;
				font-weight: 700;
				color: black;
			}
		}

		.text {
			width: 100%;
			height: 32px;
			float: left;
			margin-top: 16px;
			display: flex;
			align-items: center;
			justify-content: center;

			p {
				text-align: center;
				font-size: 12px;
				color: #6E7191;
			}

			.bold {
				font-weight: 700;
			}
		}

		.login-link {
			width: 100%;
			height: 50px;
			float: left;
			margin-top: 10px;

			button {
				height: 50px;
				width: calc(100% - 80px);
				background-color: @main-color;
				border-radius: 8px;
				border: 0px;
				color: white;
				font-weight: 700;
				font-size: 14px;
			}

			a {
				width: calc(100% - 0px);
				height: 50px;
				display: flex;
				align-items: center;
				float: left;
				justify-content: center;

			}
		}
	}
}

.hesap-favorites-error {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 99999999999;
	background-color: rgba(0, 0, 0, 0.8);

	.container {
		width: calc(100% - 20px);
		height: 362px;
		float: left;
		background-color: white;
		padding: 7px;
		border-radius: 8px;

		.close {
			width: 100%;
			height: 20px;
			display: flex;
			align-items: center;
			justify-content: right;

			span {
				display: flex;
				width: 20px;
				height: 20px;
				align-items: center;
				justify-content: center;
				font-size: 17px;
				background-color: #C5C6D3;
				border-radius: 100px;
				color: #6E7191;
			}
		}

		.vector {
			width: 100%;
			height: auto;
			float: left;
			display: flex;
			justify-content: center;
			margin-top: -10px;
		}

		.title {
			width: 100%;
			height: 38px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 10px;

			span {
				text-align: center;
				font-size: 14px;
				font-weight: 700;
				color: black;
			}
		}

		.text {
			width: 100%;
			height: 32px;
			float: left;
			margin-top: 16px;
			display: flex;
			align-items: center;
			justify-content: center;

			p {
				text-align: center;
				font-size: 12px;
				color: #6E7191;
			}

			.bold {
				font-weight: 700;
			}
		}

		.login-link {
			width: 100%;
			height: 50px;
			float: left;
			margin-top: 10px;

			button {
				height: 50px;
				width: calc(100% - 80px);
				background-color: @main-color;
				border-radius: 8px;
				border: 0px;
				color: white;
				font-weight: 700;
				font-size: 14px;
			}

			a {
				width: calc(100% - 0px);
				height: 50px;
				display: flex;
				align-items: center;
				float: left;
				justify-content: center;

			}
		}
	}
}

.hesap-notifications-error {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 99999999999;
	background-color: rgba(0, 0, 0, 0.8);

	.container {
		width: calc(100% - 20px);
		height: 362px;
		float: left;
		background-color: white;
		padding: 7px;
		border-radius: 8px;

		.close {
			width: 100%;
			height: 20px;
			display: flex;
			align-items: center;
			justify-content: right;

			span {
				display: flex;
				width: 20px;
				height: 20px;
				align-items: center;
				justify-content: center;
				font-size: 17px;
				background-color: #C5C6D3;
				border-radius: 100px;
				color: #6E7191;
			}
		}

		.vector {
			width: 100%;
			height: auto;
			float: left;
			display: flex;
			justify-content: center;
			margin-top: -10px;
		}

		.title {
			width: 100%;
			height: 38px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 10px;

			span {
				text-align: center;
				font-size: 14px;
				font-weight: 700;
				color: black;
			}
		}

		.text {
			width: 100%;
			height: 32px;
			float: left;
			margin-top: 16px;
			display: flex;
			align-items: center;
			justify-content: center;

			p {
				text-align: center;
				font-size: 12px;
				color: #6E7191;
			}

			.bold {
				font-weight: 700;
			}
		}

		.login-link {
			width: 100%;
			height: 50px;
			float: left;
			margin-top: 10px;

			button {
				height: 50px;
				width: calc(100% - 80px);
				background-color: @main-color;
				border-radius: 8px;
				border: 0px;
				color: white;
				font-weight: 700;
				font-size: 14px;
			}

			a {
				width: calc(100% - 0px);
				height: 50px;
				display: flex;
				align-items: center;
				float: left;
				justify-content: center;

			}
		}
	}
}

.hesap-add-favorites-error {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 99999999999;
	background-color: rgba(0, 0, 0, 0.8);

	.container {
		width: calc(100% - 20px);
		height: 362px;
		float: left;
		background-color: white;
		padding: 7px;
		border-radius: 8px;

		.close {
			width: 100%;
			height: 20px;
			display: flex;
			align-items: center;
			justify-content: right;

			span {
				display: flex;
				width: 20px;
				height: 20px;
				align-items: center;
				justify-content: center;
				font-size: 17px;
				background-color: #C5C6D3;
				border-radius: 100px;
				color: #6E7191;
			}
		}

		.vector {
			width: 100%;
			height: auto;
			float: left;
			display: flex;
			justify-content: center;
			margin-top: -10px;
		}

		.title {
			width: 100%;
			height: 38px;
			float: left;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 10px;

			span {
				text-align: center;
				font-size: 14px;
				font-weight: 700;
				color: black;
			}
		}

		.text {
			width: 100%;
			height: 32px;
			float: left;
			margin-top: 16px;
			display: flex;
			align-items: center;
			justify-content: center;

			p {
				text-align: center;
				font-size: 12px;
				color: #6E7191;
			}

			.bold {
				font-weight: 700;
			}
		}

		.login-link {
			width: 100%;
			height: 50px;
			float: left;
			margin-top: 10px;

			button {
				height: 50px;
				width: calc(100% - 80px);
				background-color: @main-color;
				border-radius: 8px;
				border: 0px;
				color: white;
				font-weight: 700;
				font-size: 14px;
			}

			a {
				width: calc(100% - 0px);
				height: 50px;
				display: flex;
				align-items: center;
				float: left;
				justify-content: center;

			}
		}
	}
}























//RESPONSİVE
//RESPONSİVE
//RESPONSİVE
//RESPONSİVE


@media screen and (max-width: 1768px) {
	.header-search .container {
		width: calc(100% - 85px);
		margin-left: 30px;
	}

	.main .container .banner .banner-container .banner-marginer .top-side .menu {
		display: block;
	}

	.right-side {
		display: none;
	}

	.main {
		width: calc(100% - 394px);
		margin-left: 349px;
	}

	.search-opened-card {
		width: calc(100% - 394px);
		left: 349px;
	}

	.kullanici-gizlilik {
		width: calc(100% - 394px);
		margin-left: 349px;
	}

	.uyelik-sozlesmesi {
		width: calc(100% - 394px);
		margin-left: 349px;
	}

	.page-404 {
		width: calc(100% - 394px);
		margin-left: 349px;
	}

	.header-search {
		width: calc(100% - 304px);
		left: 304px;
	}

	.main .container .main-container .main-inner {
		max-width: 1146px;
	}

	.right-side .container .small-close {
		display: flex;
	}

	.right-side .container .content {
		height: calc(100% - 122px);
	}
}

@media screen and (max-width: 1550px) {
	.main {
		width: calc(100% - 334px);
		margin-left: 324px;
	}

	.kullanici-gizlilik {
		width: calc(100% - 334px);
		margin-left: 324px;
	}

	.uyelik-sozlesmesi {
		width: calc(100% - 334px);
		margin-left: 324px;
	}

	.page-404 {
		width: calc(100% - 334px);
		margin-left: 324px;
	}
}

@media screen and (max-width: 1420px) {
	.side-menu .container .bot .container .item .title span {
		font-size: 14px;
		margin-left: 2px;
	}

	.side-menu {
		width: 223px;
	}

	.side-menu .container .menu .container .item .title span {
		font-size: 14px;
	}

	.side-menu .container .menu .container .item .icon {
		margin-left: 6px;
	}

	.side-menu .container .menu .container .item .title {
		width: calc(100% - 62px);
	}

	.side-menu .container .menu .container {
		width: calc(100% - 32px);
		margin-left: 16px;
	}

	.main {
		width: calc(100% - 253px);
		margin-left: 243px;
	}

	.search-opened-card {
		width: calc(100% - 253px);
		left: 243px;
	}

	.kullanici-gizlilik {
		width: calc(100% - 253px);
		margin-left: 243px;
	}

	.uyelik-sozlesmesi {
		width: calc(100% - 253px);
		margin-left: 243px;
	}

	.page-404 {
		width: calc(100% - 253px);
		margin-left: 243px;
	}

	.header-search {
		width: calc(100% - 223px);
		left: 223px;
	}

	.header-search .container {
		margin-left: 10px;
		width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1330px) {
	.small-menu {
		display: block;
	}

	.side-menu {
		display: none;
	}

	.header-search {
		display: none;
	}

	.main {
		width: 90%;
		margin-left: 5%;
		margin-top: 0px;
	}

	.kullanici-gizlilik {
		width: 90%;
		margin-left: 5%;
		margin-top: 74px;
	}

	.uyelik-sozlesmesi {
		width: 90%;
		margin-left: 5%;
		margin-top: 74px;
	}

	.page-404 {
		width: 90%;
		margin-left: 5%;
		margin-top: 74px;
	}
}

@media screen and (max-width: 1170px) {
	.small-menu .menu-container .menu .menu-inner .item {
		margin-left: 20px;
	}
}

@media screen and (max-width: 1130px) {
	.main .container section.newest-adverts .section-container .list .list-container .item {
		width: 100%;
		margin-left: 0 !important;
	}
}

@media screen and (max-width: 1080px) {
	.small-menu .menu-container .menu .menu-inner .item {
		margin-left: 10px;
	}
}

@media screen and (max-width: 1004px) {
	.small-menu .menu-container .menu .menu-inner .item .item-container .text span {
		font-size: 14px;
	}

	.small-menu .menu-container .logo {
		margin-left: 1%;
	}

	.small-menu .menu-container .menu {
		margin-left: 10px;
	}

	.main .container .banner .banner-container .banner-marginer .title h1 {
		font-size: 32px;
	}

	.main .container .banner .banner-container .banner-marginer .form .form-container {
		padding: 12px;
	}

	.main .container .banner .banner-container .banner-marginer .form .form-container .left {
		width: 140px;
	}

	.main .container .banner .banner-container .banner-marginer .form .form-container .center-right {
		width: 140px;
	}

	.main .container .banner .banner-container .banner-marginer .form .form-container .center-left {
		width: calc(100% - 10px);
	}

	.main .container .properties {
		height: 650px;
	}

	.main .container .properties .section-container .list .item {
		width: calc(50% - 12px);
	}

	.main .container .properties .section-container .list .item:nth-child(3) {
		margin-left: 0;
		margin-top: 12px;
	}

	.main .container .properties .section-container .list .item:nth-child(4) {
		margin-top: 12px;
	}
}

@media screen and (max-width: 900px) {
	.small-menu .menu-container .logo img {
		height: 13px;
	}

	.small-menu .menu-container .menu .menu-inner .item .item-container .text span {
		font-size: 12px;
	}

	.main .container .banner .banner-container .banner-marginer .form .form-container .center-left {
		padding-left: 5px;
		padding-right: 5px;
	}
}











@media screen and (max-width: 768px) {
	.page-404 .container .title span {
		font-size: 16px;
		color: #363636;
	}

	.page-404 .container .title {
		height: 32px;
	}

	.page-404 .container .info {
		margin-top: 5px;
	}

	.page-404 .container .info span {
		font-size: 20px;
	}

	.page-404 .container .sub-info a {
		font-size: 12px;
	}

	.page-404 .container .sub-info {
		margin-top: 12px;
	}

	.kullanici-gizlilik {
		width: 100%;
		padding-left: 12px;
		padding-right: 12px;
		margin-left: 0;
	}

	.uyelik-sozlesmesi {
		width: 100%;
		padding-left: 12px;
		padding-right: 12px;
		margin-left: 0;
	}

	.page-404 {
		width: calc(100% - 32px);
		margin-left: 16px;
		margin-top: 64px;
		height: calc(100% - 116px);
		border: 1px solid #F5F5F5;
		border-radius: 10px;

		a {
			text-decoration: none
		}
	}

	.main .container .banner .banner-container .banner-marginer .top-side {
		height: auto;
	}

	.small-menu {
		display: none;
	}

	.banner-in-top {
		display: none;
	}

	.small-side-menu {
		display: none;
	}

	.pagination-b {
		margin-bottom: 100px !important;
		display: flex !important;
		justify-content: center;
	}



	.ilan-detay-c {
		width: calc(100% - 0px) !important;
		margin-left: 0px !important;
	}

	.right-side {
		width: 100%;
		margin-left: 0;
	}

	.see-all-top {
		display: flex;
	}

	.pagination-s {
		display: flex;
	}

	.main .container section.news .section-container .list {
		margin-top: 12px;
	}

	/* width */
	.main .container section.news .section-container .list::-webkit-scrollbar {
		height: 1px;
	}

	.section.news {
		height: 350px;
	}

	.section.news .section-container .list .list-container .item .item-container .bottom {
		height: 140px;
	}

	.main .container section.featured {
		height: 440px;
	}

	.main .container section.newest-adverts {
		height: 520px;
	}

	.main .container section.news .section-container .list .list-container .item {
		margin-left: 10px;
	}

	.main .container section.news .section-container .list .list-container .item:first-child {
		margin-left: 16px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom {
		padding: 0;
		margin-top: -15px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .button {
		margin-top: 12px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .owner .outer {
		margin-right: 5px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .button span {
		font-size: 12px;
		padding: 0px;
		display: block;
		width: 100%;
		text-align: center;
		line-height: 36px;
		height: 36px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .owner {
		height: 30px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .owner .outer {
		height: 30px;
		width: 30px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .owner .outer img {
		width: 15px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .date span {
		font-size: 10px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .atitle {
		height: 15px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .date {
		height: 15px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .atitle span {
		font-size: 10px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .explanation {
		height: 30px;
		overflow-y: hidden;
		margin-top: 6px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .bottom .bottom-container .explanation p {
		font-size: 10px;
	}

	.main .container section.news .section-container .list .list-container .item {
		width: 167px;
		height: 252px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container {
		padding: 12px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .photo {
		height: 102px;
	}

	.main .container section.news .section-container .list .list-container .item .item-container .photo img {
		height: 102px;
		border-radius: 10px;
	}

	.main .container section.news {
		margin-top: 9px;
	}

	.main .container section.news .section-container .title {
		width: calc(100% - 87px);
	}

	.main .container section.news .section-container .see-all-top {
		height: 36px;
	}

	.main .container section.news .section-container .title span {
		font-size: 14px;
		padding-left: 16px;
	}

	.main .container section.newest-adverts .section-container .list {
		margin-top: 0;
	}

	.main .container section.newest-adverts {
		margin-top: 18px;
	}

	.main .container section.newest-adverts .section-container .title {
		width: calc(100% - 87px);
	}

	.main .container section.newest-adverts .section-container .title span {
		font-size: 14px;
		padding-left: 16px;
	}

	.main .container section.newest-adverts .section-container .see-all-top {
		height: 36px;
	}

	.main .container section.about-corporate {
		margin-top: 23px;
	}

	.main .container section.featured .section-container .top {
		height: 36px;
	}

	.main .container section.featured .section-container .top .title span {
		font-size: 14px;
		padding-left: 16px;
	}

	.main .container section.featured {
		margin-top: 18px;
	}

	.main .container section.popular-states {
		height: 160px;
	}

	.main .container section.popular-states .section-container .list .list-container .item .title {
		height: 34px;
		margin-top: -34px;
	}

	.main .container section.popular-states .section-container .list .list-container .item .title span {
		font-size: 9px;
	}

	.main .container section.popular-states .section-container .list {
		height: 105px;
	}

	.main .container section.popular-states .section-container .list .list-container {
		height: 105px;
		margin-top: 0;
	}

	.main .container section.popular-states .section-container .list .list-container a {
		margin-left: 10px !important;
		color: transparent;
	}

	.main .container section.popular-states .section-container .list .list-container .item {
		width: 122px;
		height: 90px;
	}

	.main .container section.popular-states .section-container .list .list-container .item .image {
		height: 90px;
	}

	.main .container section.popular-states .section-container .list .list-container .item .image img {
		height: 90px;
		border-radius: 10px;
	}

	.main .container section.popular-states .section-container .top .title span {
		font-size: 14px;
	}

	.main .container section.popular-states .section-container .top .title {
		padding-left: 16px;
	}

	.main .container section.popular-states {
		margin-top: 18px;
	}

	.main .container section.shortcuts .shortcuts-container .item {
		margin-left: 14px !important;

		a {
			color: #2D1D92;
			font-weight: 500;
			font-size: 12px;
			padding: 10px;
		}
	}

	.main {
		margin-top: 0px;
	}

	.main .container section.shortcuts {
		background-color: white;
		height: 66px;
		margin-top: 18px;
	}

	.main .container section.shortcuts .shortcuts-container {
		margin-top: 5px;
		height: 61px;
	}

	.main .container .banner .banner-container {
		border-radius: 0px;
	}

	.main .container .banner .banner-container .background-linear {
		border-radius: 0px;
	}

	.main .container .banner .banner-container .banner-marginer .title {
		margin-top: 6px;
		padding-right: 74px;
	}

	.main .container .banner .banner-container .banner-marginer .title span {
		padding-left: 20px;
	}

	.main .container .banner .banner-container .banner-marginer .title h1 {
		font-size: 20px;
	}

	.main .container .banner .banner-container .banner-marginer .title {
		height: 60px;
		width: 100%;
	}

	.main .container .banner {
		height: 500px;
	}

	.main .container section.popular-states .section-container .top {
		height: 32px;
	}

	.main .container section.popular-states .section-container .top .title {
		height: 32px;
	}

	.main .container .properties {
		display: none;
	}

	.main .container section.about-corporate .section-container .left .title {
		height: 29px;
	}

	.main .container section.about-corporate {
		height: 208px;
		border-radius: 0px;
	}

	.main .container section.about-corporate .section-container .right a {
		display: block;
		padding: 0;
		height: 40px;
		width: 100%;
		text-align: center;
		line-height: 40px;
	}

	.main .container section.about-corporate .section-container {
		padding: 0;
		padding-left: 20px;
		padding-right: 20px;
		padding-top: 20px;
	}

	.main .container section.about-corporate .section-container .left .title span {
		font-size: 14px;
	}

	.main .container section.about-corporate .section-container .left .info p {
		font-size: 12px;
	}

	.main .container section.about-corporate .section-container .left {
		width: 100%;
		height: 111px;
	}

	.main .container section.about-corporate .section-container .left .info {
		margin-top: 10px;
	}

	.main .container section.about-corporate .section-container .right {
		width: 100%;
		margin-top: 12px;
	}

	.main {
		width: 100% !important;
		margin-left: 0px !important;
	}
}





.double-range-slider {
	margin-top: 30px;
}

.slider-labels span {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 500;
	font-size: 12px;
	border-radius: 8.5px;
	background-color: #E8FAA6;

	line-height: 150%;
	color: #4A4A4A;
	padding: 3px 8px 5px 8px;
}

.noUi-target,
.noUi-target * {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-ms-touch-action: none;
	touch-action: none;
	-ms-user-select: none;
	-moz-user-select: none;
	user-select: none;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.noUi-target {
	position: relative;
	direction: ltr;
}

.noUi-base {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
	/* Fix 401 */
}

.noUi-origin {
	position: absolute;
	right: 0;
	top: 0;
	left: 0;
	bottom: 0;
}

.noUi-handle {
	position: relative;
	z-index: 1;
}

.noUi-stacking .noUi-handle {
	/* This class is applied to the lower origin when
     its values is > 50%. */
	z-index: 10;
}

.noUi-state-tap .noUi-origin {
	-webkit-transition: left 0.3s, top .3s;
	transition: left 0.3s, top .3s;
}

.noUi-state-drag * {
	cursor: inherit !important;
}

/* Painting and performance;
   * Browsers can paint handles in their own layer.
   */
.noUi-base,
.noUi-handle {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

/* Slider size and handle placement;
   */
.noUi-horizontal {
	height: 4px;
}

.noUi-horizontal .noUi-handle {
	width: 15px;
	height: 15px;
	border-radius: 50%;
	left: -7px;
	top: -7px;
	background-color: #CEBEFE;

}

/* Styling;
   */
.noUi-background {
	background: #f5f5f5;
}

.noUi-connect {
	background: @main-color;
	-webkit-transition: background 450ms;
	transition: background 450ms;
}

.noUi-origin {
	border-radius: 2px;
}

.noUi-target {
	border-radius: 2px;
}


/* Handles and cursors;
   */
.noUi-draggable {
	cursor: w-resize;
}

.noUi-vertical .noUi-draggable {
	cursor: n-resize;
}

.noUi-handle {
	cursor: default;
	-webkit-box-sizing: content-box !important;
	-moz-box-sizing: content-box !important;
	box-sizing: content-box !important;
}

.noUi-handle:active {
	border: 8px solid @main-color;
	border: 8px solid rgba(53, 93, 187, 0.38);
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	left: -14px;
	top: -14px;
}

/* Disabled state;
   */
[disabled].noUi-connect,
[disabled] .noUi-connect {
	background: #B8B8B8;
}

[disabled].noUi-origin,
[disabled] .noUi-handle {
	cursor: not-allowed;
}