/*font-family: "Inter", sans-serif;*/

/*font-family: "Montserrat", serif;*/

/*font-family: "Abhaya Libre", serif;*/

body {

	font-family: "Montserrat", serif;

}



.wrapper.home {

	min-height: 100vh;

	background: url('../images/home-bg.jpg') top center no-repeat;

	display: flex;

	flex-direction: column;

}



header {

	padding: 86px 49px 102px 49px;

	display: flex;

	justify-content: space-between;

	align-items: center;

}



.language {

	display: flex;

	align-items: center;

}



.language button {

	background-color: rgba(249, 249, 249, 0.3);

	width: 50px;

	height: 28px;

	border-radius: 7px;

	font-family: "Inter", sans-serif;

	color: #fff;

	border: 1px solid transparent;

	transition: 0.3s;

	font-size: 10px;

	will-change: transform;

}



.language button.active {

	background-color: #000;

	width: 35px;

	height: 35px;

	border-color: #6C6C6C;

	position: relative;

	z-index: 1;

}



.home-title {

	color: #fff;

	text-align: center;

	font-family: "Abhaya Libre", serif;

	font-size: 20px;

	letter-spacing: 12px;

	max-width: 250px;

	width: 100%;

	margin: 0 auto 50px auto;

	line-height: normal;

}



.home-menu {

	margin-top: auto;

	padding: 0 60px;

	display: flex;

	flex-direction: column;

	gap: 11px;

	width: 100%;

	padding-bottom: 123px;

}



.home-menu-box {

	display: flex;

	gap: 13px;

	align-items: stretch;

}



.home-menu-box .home-menu-icon {

	width: 31px;

	height: 55px;

	background-color: #fff;

	border-radius: 6px;

	display: flex;

	align-items: center;

	justify-content: center;

}



.home-menu-box .home-menu-item {

	flex: 1;

	border: 1px solid #fff;

	display: flex;

	align-items: center;

	border-radius: 6px;

	justify-content: center;

	color: #fff;

	font-size: 12px;

	letter-spacing: 0.4em;

	transition: 0.3s;

	will-change: background;

	background-color: transparent;

	font-family: "Montserrat", serif;

}



.home-menu-box .home-menu-item:hover {

	background-color: #fff;

	color: #000;

}



.contact-area {

	width: 100%;

	min-height: 55vh;

	background-color: #fff;

	position: fixed;

	bottom: -100%;

	border-radius: 64px 64px 0 0;

	transition: 0.4s;

}

.contact-area.active{

	bottom: 0;

}

.header-area {

	height: 65px;

	box-shadow: 0px 16px 18px 0px #ffffff;

	position: relative;

	z-index: 2;

}



.header-area .prev-button {

	position: absolute;

	top: 33px;

	left: 39px;

	background-color: #fff;

}

.contact-area .map{

	overflow: hidden;

}

.contact-area .map img {

	position: relative;

	top: -80px;

}





.contact-info {

	position: absolute;

	bottom: 0;

	padding:0 39px 82px 39px;

	z-index: 2;

	width: 100%;

	background: #fff;

	box-shadow: -17px -5px 44px 41px #fff;

}

.contact-info nav{

	display: flex;

	flex-direction: column;

	gap: 8px;

}

.contact-info nav a {

	display: flex;

	align-items: center;

	gap: 8px;

}

.contact-info nav a:first-child{

	flex-direction: column;

	gap: 4px;

	align-items: flex-start;

	margin-bottom: 10px;

}

.contact-info p {

	color: #000;

	font-size: 13px;

	line-height: 18px;

}



.contact-info nav a:hover p {

	text-decoration: underline;

}



.direction-button{

	background-color: transparent;

	position: absolute;

	top: -55px;

	right: 18px;

}



.evaluation-area .header-area{

	display: flex;

	align-items: center;

	justify-content: center;

}

.evaluation-area .header-area h6{

	margin-top: 18px;

	font-size: 20px;

	color: #121212;

	font-family: "Abhaya Libre", serif;

}

.evaluation-area .header-area{

	box-shadow: none;

	margin-bottom: 10px;

}

.evaluation-area .stars{

	display: flex;

	align-items: center;

	justify-content: center;

}

.evaluation-area .stars button{

	background-color: #fff;

 

}

.evaluation-area .stars button svg{

	fill: #C2C2C2;;

}

.evaluation-area .stars button.active svg{

	fill: #000;;

}

.evaluation-area .stars{

	margin-bottom: 23px;

}

.evaluation-area  form{

	padding:0 39px 82px 39px;

}

.evaluation-area  form textarea{

	width: 100%;

	height: 245px;

	border-radius: 19px;

	margin-bottom: 24px;

	padding: 15px;

	border: 1px solid rgba(150, 150, 150, 0.5);

	font-family: "Montserrat", serif;

}

.evaluation-area  form  button[type="submit"]{

	width: 119px;

	height: 33px;

	background-color: #000;

	border-radius: 7px;

	color: #fff;

	font-family: "Abhaya Libre", serif;

	font-size: 20px;

}

.btn-wrp{

	text-align: center;

}



.menu-header{

	display: flex;

	flex-direction: column;

	position: relative;

	background: url('../images/menu/head.jpg') top center no-repeat;

	background-size: cover;

	border-radius: 0 0 32px 32px;

	padding-bottom: 13px;

	position: relative;

	overflow: hidden;

}

.menu-header::after{

	content: '';

	width: 100%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	background: linear-gradient(to top, rgb(0 0 0 / 73%), rgba(0, 0, 0, 0));

}



.menu-header .top-header{

	padding: 25px 27px 0 27px;

	display: flex;

	justify-content: center;

	gap: 56px;

	position: relative;

	z-index: 1;

}



.menu-header .top-header .language{

	position: absolute;

	right: 16px;

	top: 48px;

}



.menu-header .bottom-header{

	margin-top: 24px;

	position: relative;

	z-index: 1;

}

.menu-header .bottom-header .bottom-header-title{

	color: #fff;

	text-align: center;

	font-size: 15px;

	letter-spacing: 0.58rem;

}



.menu-header .bottom-header .prev-button{

	background-color: transparent;

	margin-top: 15px;

	margin-bottom: 10px;

	margin-left: 18px;

}

.menu-header .bottom-header .categories{

	background-color: #000;

	border-radius: 20px 20px 0 0;

	overflow: hidden;

}

.menu-header .bottom-header .categories-list{

	display: flex;

	overflow-x: auto;

	padding-left: 10px;

	

	 

}

.menu-header .bottom-header .categories button{

	height: 76px;

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: center;

	background-color: #000;

	white-space: nowrap;

	text-align: center;

	gap: 4px;

	

}
.menu-header .bottom-header .categories button img{
	height: 23px;
}
.menu-header .bottom-header .categories button span{

	color: #969696;

	font-family: "Inter", sans-serif;

	font-size: 11px;

}

.menu-header .bottom-header .rating{

	padding: 18px 18px 10px 18px;

	box-shadow: inset 0px 5px 11px 1px #00000091;

}

.menu-header .bottom-header .rating span svg{

	fill: #C2C2C2;

	width: 17px;

	height: 17px;

}

.menu-header .bottom-header .rating span.active svg{

	fill: #fff;

	width: 17px;

	height: 17px;

}

.menu-header .bottom-header .text{

	padding: 0 18px;

}

.menu-header .bottom-header .text h6{

	background-color: #040404;

	font-family: "Abhaya Libre", serif;

	color: #fff;

	display: inline-block;

	font-size: 20px;

	padding: 5px 10px;

	border-radius: 4px;

	margin-bottom: 15px;

}
.menu-header .bottom-header .text h6.active-text {
	background-color: #fff !important;
	color: #040404 !important;
}
.menu-header .bottom-header .text p{

	color: #fff;

	font-size: 15px;

	line-height: 22px;

}

.content-list{

	display: flex;

	flex-direction: column;

	padding:38px 16px;

	gap: 35px;

}

.content-list .content-box{

	background-color: #F3F2F2;

	border: 1px solid #DCDCDC;

	padding: 13px 18px;

	display: flex;

	position: relative;

	border-radius: 19px;

	box-shadow: 4px 2px 10px 1px #00000038;
	min-height: 125px;

}

.content-list .content-box h6{

	font-size: 15px;

	color: #7D7D7D;

	font-weight: 700;

	margin-bottom: 6px;

	line-height: 22px;

}

.content-list .content-box p{

	color: #7D7D7D;

    font-size: 10px;

    font-weight: 500;

    line-height: 16px;

    font-style: italic;

}

.content-list .content-box  .content-box-left{

	width: calc(100% - 150px);
	display: flex;
			flex-direction: column;
}

.content-list .content-box .price{

	margin-top: auto;

	width: 55px;

	height: 20px;

	display: flex;

	align-items: center;

	justify-content: center;

	background-color: #000;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	border-radius: 4px;

}

.content-list .content-box  img{

	position: absolute;
	right: 0;
	top: 0;
	height: 125px;
	width: 150px;
	border-radius: 5px;
	border: 2px solid #eee;
	box-shadow: 0px 0px 1px 1px #0000002b;

}

.detail-page{

	background: url('../images/menu/detail/menu-bg.png') top center no-repeat;

	background-size: cover;

}

.detail-page .text{

	margin-top: 136px;

}

.detail-page  .bottom-header .text h6{

	background-color: transparent;

	color: #fff;

	padding: 0;

}



.content-detail-list{

	

	padding: 38px 16px;

	display: flex;

	flex-direction: column;

	gap: 12px;

}

.content-detail-list-box{

	display: flex;

	flex-direction: column;

}

.content-detail-list-box .image{

	position: relative;

}

.content-detail-list-box .image .rating{

	background-color: #000;

	padding: 3px 5px;

	border-radius: 4px;

	display: flex;

	gap: 4px;

}

.content-detail-list-box .image .rating{

	display:flex;

}

.content-detail-list-box .image .rating svg{

	width: 10px;

	height: 10px;

	fill: #fff;

}

.content-detail-list-box .image  .image-filter{

	width: 100%;

	position: absolute;

	bottom: 0;

	padding: 12px;

	display: flex;

	justify-content: flex-end;

	align-items: stretch;

	gap: 5px;

}

.content-detail-list-box .image .count{

	background-color: #000;

	padding: 3px 5px;

	color: #fff;

	font-size: 15px;

	border-radius: 4px;

	font-family: "Abhaya Libre", serif;

	display: flex;

	align-items: center;

}

.content-detail-list-box .info{

	border: 1px solid #DCDCDC;

	background-color: #F3F2F2;

	border-radius: 0 0 19px 19px;

	padding: 25px 20px 13px 20px;

	margin-top: -16px;

	box-shadow: 0 10px 10px -5px rgb(0 0 0 / 24%);

}

.content-detail-list-box .info h6{

	font-size: 15px;

	color: #7D7D7D;

	font-weight: 700;

	margin-bottom: 6px;

	line-height: 22px;

}

.content-detail-list-box .info p{

	color: #7D7D7D;

	font-size: 12px;

	font-weight: 500;

	line-height: 16px;

	font-style: italic;

}

.content-detail-list-box .info .price{

	margin-top: 18px;

    width: 55px;

    height: 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    background-color: #000;

    font-family: "Abhaya Libre", serif;

    color: #fff;

    font-size: 15px;

    border-radius: 4px;

}

.kategoriButon.active-button span {
	color: #fff !important;
}
