
/* File data: default.css */

*{margin: 0; padding: 0; box-sizing: border-box; outline: none !important}

html{width: 100%; height: 100%; margin: 0; padding: 0;}
table{border-collapse: collapse; border-spacing: 0;}
fieldset, img{border: 0;}
sup{vertical-align: text-top;}
sub{vertical-align: text-bottom;}
input, textarea, select{font-family: inherit; font-size: inherit; font-weight: inherit;}
input, textarea, select{*font-size: 100%;}
input[type="checkbox"]{position: relative; top: 2px; margin-right: 2px}
select, input[type="button"], input[type="submit"]{-webkit-appearance: none}
a, img{outline: 0;}
a{color: inherit;}
label{cursor: pointer;}
li{list-style: none;}
p{margin-bottom: 15px}

.block{display: block;}	
.inline{display: inline;}
.clear{clear: both; line-height: 0 !important; font-size: 0 !important; height: 0 !important;}
.hidden{display: none;}
.clearfix:after {content: ""; display: block; clear: both;}
.no-padding{padding: 0 !important}

.editable p {padding: 0; margin-bottom: 10px;}
.editable ol, .editable ul{margin: 0 0 30px 0}
.editable li{padding: 0 0 12px 0;}
.editable li span{color: #ff4800}
.editable ol li{list-style: decimal; list-style-position: outside; padding-left: 10px}
.editable ul li{list-style-position: inside; padding-left: 30px; background: url("/media/css/../images/svg/list-marker.svg") no-repeat left top 3px; }
.editable td{padding: 5px 10px;}
.editable table{width: 100%;}
.editable table td{word-wrap: break-word}

h1{font: 42px/50px "Oswald-Light"; margin-bottom: 15px;}
h1.centered{text-align: center;}
h2{font: 32px/42px "Oswald-Light"; margin-bottom: 15px;}
h3{font: 22px/30px "Oswald-Light"; margin-bottom: 15px;}

@font-face {
    font-family: 'Oswald-Light';
    src: url('/media/css/../fonts/Oswald-Light.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Oswald-Regular';
    src: url('/media/css/../fonts/Oswald-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Rubik-Regular';
    src: url('/media/css/../fonts/Rubik-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}


/* End of file */


/* File data: responsive-style.css */

/* Structure */
html{height: 100%;}
body{height: 100%; min-width: 320px; position: relative; font: 16px/24px "Rubik-Regular"; color: #24262f; overflow-x: hidden}

#container{min-height: 100%; position: relative; box-sizing: border-box; overflow-x: hidden}
#sticky-footer-wrapper {padding-bottom: 570px;}
#header{position: relative;}
#content{min-height: 200px}
#footer{position: absolute; left: 0; bottom: 0; width: 100%; height: 570px; background: #fdf1e3;}

.wrapper-1600{max-width: 1600px; margin: 0 auto; padding: 0 10px; box-sizing: content-box; position: relative;}
.wrapper-1200{max-width: 1200px; margin: 0 auto; padding: 0 10px; box-sizing: content-box}
.wrapper-900{max-width: 900px; margin: 0 auto; padding: 0 10px; box-sizing: content-box}
.wrapper-800{max-width: 800px; margin: 0 auto; padding: 0 10px; position: relative; box-sizing: content-box}
.wrapper-670{max-width: 670px; margin: 0 auto; padding: 0 10px; position: relative; box-sizing: content-box}
.wrapper-640{max-width: 640px; margin: 0 auto; padding: 0 10px; position: relative; box-sizing: content-box}
.wrapper-540{max-width: 540px; margin: 0 auto; padding: 0 10px 30px; position: relative; box-sizing: content-box}
.wrapper-500{max-width: 500px; margin: 0 auto; padding: 0 10px 30px; position: relative; box-sizing: content-box}
.wrapper-1600 .wrapper-670{padding:0}

/* Common styles */
.button{display: inline-block; min-width: 200px; padding: 0 30px; text-transform: uppercase; color: #24262f; text-align: center;
    text-decoration: none; height: 70px; cursor: pointer; font: 18px/29px "Oswald-Regular"}
.button.orange {background: url("/media/css/../images/bg_yellow_button.png") no-repeat; background-size: 100% 100%}
.button.yellow {background: url("/media/css/../images/bg_yellow_button.png") no-repeat; background-size: 100% 100%; color: #24262f}
.yellow-background{padding: 25px 0 90px; position: relative}
.yellow-background.top-block{padding: 0 0 15px 0}
.yellow-background.category h1+p{text-align: left; margin-top: 0}
.black-background{position: relative; min-height: 300px}
.black-background h1, .black-background h2, .black-background h3{color: #fba83c; text-align: center;}
.black-background-wrapper{padding: 40px 0 50px; position: relative}
.black-background-wrapper > div{position: relative}
.black-background-wrapper h2{color: #fba83c}
.black-background-wrapper .button{display: flex; margin: 40px auto 0; width: 290px; padding: 0; justify-content: center;
align-items: center;}
.delivery-title{margin: 20px 0 10px 0;}
.delivery-title+p{text-align: center}

.ya-share2{display: inline-block}
.share-wrapper>span{position: relative; bottom: -7px;}
.share-wrapper ul{margin: 0!important}
.share-wrapper li{background: none!important; padding-left: 0!important}

.slider-wrapper{position: relative; padding: 0 80px}
#index-banner-slider.slider-wrapper{padding: 0; margin-bottom: 20px}
.restaurant-slider-wrapper{position: relative}
.slider-wrapper .swiper-button-next{right: 15px}
.slider-wrapper .swiper-button-prev{left: 15px}
#index-banner-slider a:has(img){display: block;}
#index-banner-slider .swiper-slide img{max-width: 100%; display: block; margin: 0 auto; width: 100%}
#index-banner-slider .swiper-button-prev, #index-banner-slider .swiper-button-next{display: none;}
#index-banner-slider:hover .swiper-button-prev, #index-banner-slider:hover .swiper-button-next{display: block;}

.swiper-pagination-bullets{display: flex; justify-content: center; gap: 7px; position: absolute;
z-index: 10; width: 100%; bottom: 20px}
.swiper-pagination-bullets span{width: 12px; height: 12px; border: 2px solid #fff; opacity: 1;
background: transparent;}
.swiper-pagination-bullets span.active{background: #fff}

#ui-datepicker-div{z-index: 20!important; font-family: "Rubik-Regular"}
.center-text{text-align: center}
.no-margin{margin: 0!important}
p.orange{color: #ef454f}

/* Decorations */
.decoration, .decoration-block{position: absolute; z-index: 1}
.decoration-block.left{top: 0; left: 0; bottom: 0; width: calc((100% - 820px)/2)}
.decoration-block.right{top: 0; right: 0; bottom: 0; width: calc((100% - 820px)/2)}
.decoration-block>img{position: absolute}
.decoration-block.left.pepper{top: 30px; width: calc((100% - 1200px)/2)}
.decoration-block.left.pepper img:nth-of-type(1){top: 135px; left: 45%}
.decoration-block.left.pepper img:nth-of-type(2){left: 85%}
.decoration-block.right.pepper{top: 70px; width: calc((100% - 1200px)/2)}
.decoration-block.right.pepper img:nth-of-type(1){right: 80%}
.decoration-block.right.pepper img:nth-of-type(2){top: 95px; right: 35%}
.simpleParallax{overflow: visible!important; position: absolute}
.top-block .decoration-block.left.pepper{top: 110px}
.top-block .decoration-block.right.pepper{top: 150px}

/* Header */
#header div.inner{max-width: 1600px; margin: 0 auto;}
#header-top{position: relative; display: flex; justify-content: space-between; padding-top: 12px;}
#header-top div.left{display: flex;}
#header-top div.right{display: flex; align-items: center;}
#header-top.checkout{align-items: center; max-width: 1200px; margin: 0 auto;}
#header-top.checkout span.city{font: 18px/20px "Oswald-Regular"; text-transform: uppercase; padding-left: 28px;
background: url("/media/css/../images/svg/location-marker-yellow.svg") no-repeat left top; height: 30px;}

#header-top div.city-phones .title{font-size: 13px; line-height: 16px; color: #595a61; padding-left: 28px; margin-bottom: 3px; display: block;}
#header-top div.city-phones div.city > span, #header-top div.city-phones div.phone a{font: 18px/20px "Oswald-Regular"; text-transform: uppercase;
padding-left: 28px; display: inline-block; height: 30px; padding-top: 2px}

.select-city{position: relative;}
.select-city div{background: url("/media/css/../images/svg/location-marker-yellow.svg") no-repeat left top;}
.select-city div > span{cursor: pointer; padding-right: 15px; background: url("/media/css/../images/svg/arrow-down.svg") no-repeat top 7px right 0; 
background-size: 10px 10px}
.select-city div span span{border-bottom: 1px solid #e0e0e0;}
.select-city ul{display: none; position: absolute; z-index: 100; background: #fba83c; padding: 10px 0 8px 0; border-radius: 3px;}
.select-city ul li:hover{background: #ffbc64; color: #ef454f}
.select-city ul li a{text-decoration: none; text-transform: uppercase; font-family: "Oswald-Regular"; font-size: 16px;
display: block; padding: 5px 25px;}

#header .phone a{display: block; background: url("/media/css/../images/svg/phone-yellow.svg") no-repeat left top; text-decoration: none}

#logo{display: block; height: 140px; width: 140px; position: relative; z-index: 2; margin-right: 100px;}
#logo img.logo{display: block; width: 100%; position: relative;}
#logo img.chili{top: 10px; right: -50px; position: absolute;}
#header-top div.city-phones{height: 100%; display: flex; align-items: center;}
#header-top div.city-phones > div:nth-child(2){margin: 0 38px;}

#header-top div.restaurant-phone{position: relative; background: url("/media/css/../images/svg/phone-yellow.svg") no-repeat left top;
padding-left: 28px; padding-top: 2px}
#header-top div.restaurant-phone .show-phone-list{position: relative; top: -1px; cursor: pointer; padding-right: 15px; 
background: url("/media/css/../images/svg/arrow-down.svg") no-repeat top 7px right 0; background-size: 10px 10px; text-transform: uppercase;
font: 18px/20px "Oswald-Regular"; height: 30px; display: inline-block;}
#header-top div.restaurant-phone > a{padding-left: 28px;}
#header-top div.restaurant-phone img.show-phone-list:hover{cursor: pointer}
#header-top ul.phone-list{background: #fba83c; display: none; padding: 12px 0 4px 0; position: absolute; border-radius: 3px; z-index: 20;}
#header-top ul.phone-list li{padding: 5px 25px 0 25px; margin-bottom: 5px;}
#header-top ul.phone-list li a{background: none !important; padding: 0 !important;}
#header-top ul.phone-list li span{font-size: 13px; display: block; margin-bottom: 1px}
#header-top ul.phone-list li:hover{background: #ffbc64; color: #ef454f}

#header-top div.login-button, #header-top a.cabinet{font: 18px/29px "Oswald-Regular"; text-transform: uppercase; color: #fba83c; 
cursor: pointer; width: 160px; height: 50px; border-radius: 15px; display: flex; justify-content: center; align-items: center;
background: #24262f url("/media/css/../images/svg/user-yellow.svg") no-repeat left 20px center; padding-left: 15px;}
#header-top a.cabinet{text-decoration: none; width: 200px; justify-content: flex-end; padding-right: 17px;}
#header-top div.awards{display: flex; align-items: center; justify-content: space-between; height: 70px; width: 470px;}
#header-top div.awards a{max-height: 100%;}
#header-top div.awards a img{display: block; max-height: 70px;}
#header-top div.awards .centered{height: 35px;}
#header-top div.awards .centered img{max-height: 35px;}

#header-bottom{display: flex; justify-content: space-between;}
#top-menu{width: calc(100% - 300px); display: flex; margin-bottom: 5px;}
#top-menu > li{position: relative; font: 18px/29px "Oswald-Regular"; text-transform: uppercase;}
#top-menu li.first{padding-left: 0; background: none;}
#top-menu > li > a, #top-menu > li > span{text-decoration: none; display: block; padding: 10px 12px; cursor: pointer}
#top-menu li.has-children{background: url("/media/css/../images/svg/arrow-down.svg") no-repeat center right; background-size: 8px 8px}
#top-menu > li.active > a, #top-menu > li:hover>a, #top-menu > li.active > span, #top-menu > li:hover>span{
background: url("/media/css/../images/marker.png")no-repeat center center; background-size: 100% 100%}
#top-menu li ul{width: 200px; position: absolute; top: 54px; left: 0; background: #fba83c; z-index: 15; padding: 10px 0;
    border-radius: 4px; display: none; flex-wrap: wrap; flex-direction: column}
#top-menu > li ul::before{content: ""; display: block; width: 100%; height:25px; position: absolute; top: -25px; left: 0;
    background: transparent url("/media/css/../images/triangle.png") no-repeat 20px bottom}
#top-menu li ul li{text-transform: none; font: 16px "Rubik-Regular"; position: relative; z-index: 100; cursor: pointer;}
#top-menu li ul:not(.delivery) li span, #top-menu li ul:not(.delivery) li a{display: block; text-decoration: none; padding: 7px 20px;}
#top-menu li ul li:hover{background: #ffbc64; color: #ef454f}
#top-menu li ul.delivery{width: 980px; flex-direction: row; justify-content: flex-start; padding: 10px;}
#top-menu li ul.delivery li{width: 16.6%; height: 186px; text-align: center; font-size: 16px; padding: 0}
#top-menu li ul.delivery li a{display: block; height: 100%; position: relative; text-decoration: none;}
#top-menu li ul.delivery li:hover a{text-decoration: none; background: #ffbc64}
#top-menu li ul.delivery li .icon{height: 145px; position: relative}
#top-menu li ul.delivery li .icon img{display: block; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%)}
#top-menu > li:hover ul{display: flex;}

.social{display: flex;}
.social .icon{margin: 0 5px; width: 30px; height: 30px; background-repeat: no-repeat; background-size: contain;
transition: all 0.5s ease;}
.social .icon:hover{ -moz-transform: rotate(20deg); -ms-transform: rotate(20deg); -webkit-transform: rotate(20deg);
-o-transform: rotate(20deg); transform: rotate(20deg);}
.social .icon.flamp{background-image: url("/media/css/../images/social/flamp.svg")}
.social .icon.vk{background-image: url("/media/css/../images/social/vk.svg");}
.social .icon.telegram{background-image: url("/media/css/../images/social/telegram.svg")}
.social > img{visibility: hidden;}

#cart-summery{float: right; width: 170px; height: 75px; background: url(/media/css/../images/bg_yellow_button.png) no-repeat;
    background-size: 100%; position: relative; font: 18px "Oswald-Regular"; margin: -25px 0 0 10px; transition: all 0.5s;
    position: relative; z-index: 2}
#cart-summery a{display: block; width: 100%; height: 100%; text-decoration: none; padding: 27px 20px 0 83px;
    background: url(/media/css/../images/svg/shopping-basket.svg) no-repeat left 32px center; background-size: 30px 30px}
#cart-summery .cart-quantity{position: absolute; top: 17px; left: 57px; background: #24262f; padding: 4px 6px 4px 6px; border-radius: 50%; color: #fff;
text-align: center; font: 12px/12px "Rubik-Regular";}

/* Mobile menu */
.menu-button{display: none; background: url("/media/css/../images/svg/menu-button.svg") no-repeat right 10px center; background-size: 20px 20px;
width: 90px; height: 40px; font: 18px "Oswald-Regular"; text-transform: uppercase; cursor: pointer; display: none; align-items: center;
margin-left: 25px;}
.fixed-header .menu-button{display: none;}

#mobile-menu{padding: 0 0 10px 0; background: #fdf1e3; width: 100%; position: fixed; top: 0;height: 100%;
z-index: 110; overflow-x: hidden; overflow-y: auto; left: -100%; right: auto; transition: left 0.5s;
font: 16px/20px "Oswald-Regular"; text-transform: uppercase;}
#mobile-menu.showed{left: 0;}
#mobile-menu div.white{background: #fff; padding: 40px 5% 10px 5%;}
#mobile-menu #menu-close{display: block; background: rgba(0, 0, 0, 0) url("/media/css/../images/svg/delete.svg") no-repeat;
background-size: contain; cursor: pointer; height: 30px; width: 30px; position: absolute; right: 10px; top: 10px;}
#mobile-menu div.awards{display: flex; justify-content: space-between; padding-bottom: 25px; align-items: center;
border-bottom: 1px solid #e0e0e0; margin-bottom: 25px;}
#mobile-menu div.awards a{height: 50px; margin: 0 0.5%}
#mobile-menu div.awards img{display: block; max-width: 100%; max-height: 100%;}
#mobile-menu div.awards a.centered{height: 27px;}
#mobile-menu div.awards a.centered img{max-height: 100%;}

#mobile-menu a.delivery-phone, #mobile-menu .reserve-table{display: block; border: 2px solid #24262f; border-radius: 15px; 
padding: 6px 10px 7px 48px; margin-bottom: 10px; background: url("/media/css/../images/svg/phone.svg") no-repeat left; 
text-decoration: none; box-sizing: border-box;}
#mobile-menu .reserve-table, #footer .reserve-table{border-color: #fba83c; position: relative; 
background: #fba83c url("/media/css/../images/svg/book.svg") no-repeat left; margin-bottom: 23px;}
#mobile-menu .reserve-table > ul, #footer .reserve-table > ul{display: none; width: 180px; border-radius: 6px;
background: #24262f; padding: 12px 10px;}
#mobile-menu .reserve-table > ul{border-radius: 15px;}
#mobile-menu .reserve-table > ul.open, #footer .reserve-table > ul.open{display: flex; position: absolute; bottom: 38px; right: 0;
flex-direction: column; gap: 6px;}
#mobile-menu .reserve-table > ul.open{right: -3px;}
.reserve-table ul li a{color: #fba83c; text-decoration: none;}
.reserve-table ul li a:hover{color: #fff;}
#footer .reserve-table{position: fixed; bottom: 10px; right: 100px; text-decoration: none; z-index: 16;
display: block; width: 220px; padding: 5px 12px 5px 47px; border-radius: 5px; font: 16px "Oswald-Regular";
text-transform: uppercase; cursor: pointer;}
#footer a.reserve-table.top{bottom: 55px; height: 37px; background-image: url("/media/css/../images/book-nsk.png");}
#mobile-menu a.reserve-table.top{background-image: url("/media/css/../images/book-nsk.png"); height: 37px; 
margin-bottom: 10px; border: none; background-color: #94c353;}

#mobile-menu div.city-phones *{display: block}
#mobile-menu div.city-phones div.box{display: none;}
#mobile-menu div.city-phones > div.name{margin-bottom: 15px; cursor: pointer;
background: url("/media/css/../images/svg/menu-next.svg") right center/20px 20px no-repeat;}
#mobile-menu div.city-phones > div.name span{display: inline-block !important; padding-bottom: 3px;
border-bottom: 1px solid #e0e0e0;}
#mobile-menu div.city-phones span.title span, #mobile-menu img.show-phone-list{display: none !important;}
#mobile-menu ul.phone-list{position: static; background: none;}
#mobile-menu div.city-phones a{text-decoration: none; border-bottom: 1px solid #e0e0e0; display: inline-block !important; 
margin-bottom: 10px; padding-bottom: 3px; padding-top: 5px;}
#mobile-menu div.city-phones.restyle > div.name span, #mobile-menu div.city-phones.restyle a{border: none;}
#mobile-menu div.city-phones.restyle a{padding-top: 3px;}
#mobile-menu div.city-phones.restyle ul.phone-list li span{font: 13px 'Rubik-Regular'; text-transform: none; color: #595a61;}

#mobile-main-menu{padding: 25px 5% 25px 5%;}
#mobile-main-menu li.has-children:last-child > span{display: none;}
#mobile-main-menu li > a, #mobile-main-menu li > span{text-decoration: none; cursor: pointer; display: block;
padding: 8px 20px 9px 0; border-bottom: 1px solid #e0e0e0; 
background: url("/media/css/../images/svg/menu-next.svg") right center/20px 20px no-repeat;}
#mobile-menu img.logo{display: block; width: 135px; margin: 0 auto 10px auto;}

/* Fixed header  */
.fixed-header{width: 100%; position: fixed; top: 0; left: 0; background: #fff; z-index: 15; overflow:visible !important; display: none;
border-bottom: 1px solid #ccc}
.fixed-header > div.wrapper-1600{display: flex; justify-content: space-between; align-items: center;  height: 80px;}
.fixed-header #cart-summery{margin: 0; height: 72px; display: block !important;}
.fixed-header #top-menu{margin:7px 0 0 0;}
.fixed-header #menu-button{width: 90px !important;}

/* Content area */
.about{min-height: 200px; padding: 40px 0 60px; position: relative; background: #fdf1e3}
.about img.title{display: block; margin: 0 auto 50px; position: relative; z-index: 2}
.about img.title.mobile{display: none}
.about .button{display: flex; width: 210px; margin: 40px auto 0; position: relative; z-index: 2; justify-content: center;
align-items: center;}
.about .decoration-block.left img{bottom: 80px; left: 35%;}
.about .decoration-block.right img{bottom: 20px; right: 45%;}

.restaurants{padding: 0 0 70px 0}
.restaurants .wrapper-1600{position: relative}
.restaurants .decoration-block.left{top: 160px; width: calc((100% - 820px)/2)}
.restaurants .decoration-block.right{top: 150px;  width: calc((100% - 820px)/2)}
.restaurants .decoration-block.left img{left: 30%}
.restaurants-list{padding: 50px 60px;}
.restaurants-list .wrapper-1600{position: relative}
.restaurants-list .swiper-slide{overflow: hidden}
.restaurants-list .swiper-slide a{display: block;}
.restaurants-list .swiper-slide .address{position: absolute; bottom: 25px; left: 20px; background: url("/media/css/../images/marker.png")no-repeat;
    background-size: 100% 100%; padding: 13px 65px 15px 30px; display: inline-block; font: 22px "Oswald-Regular"; text-transform: uppercase;
    transition: transform 0.35s;}
.restaurants-list .swiper-slide img{width: calc(100% + 60px); transition: transform 0.35s; transform: translate3d(-50px,0,0);}
.restaurants-list .swiper-slide:hover img{transform: translate3d(0,0,0)}
.restaurants-list .swiper-slide:hover .address{transform: translate3d(50px,0,0)}

.restaurant-slider-wrapper{height: 700px}
.restaurant-slider{position: relative;}
.restaurant-slider .wrapper-1600{position: absolute; z-index: 1; height: 100%; width: 100%; left: 50%; transform: translateX(-50%)}
.restaurant-slider .breadcrumbs{position: absolute; top: 0; left: 15px}
.restaurant-slider .swiper-button-prev{left: 20px}
.restaurant-slider .swiper-button-next{right: 20px}
/*.restaurant-slider .swiper-slide img{max-width: 100%}*/

.kr-cloud, .restaurant-contacts{width: 535px!important; height: 522px!important; position: absolute; top: 50% !important; 
left:50% !important; transform: translate(-50%, -50%) !important; background: url("/media/css/../images/cloud-background.png") no-repeat center;
background-size: contain; padding: 110px 55px 0 55px!important; text-align: center; color: #fff}
.kr-cloud .address, .restaurant-contacts .address{font: 30px "Oswald-Regular"!important; margin-bottom: 12px !important; color: #fba83c}
.kr-cloud p, .restaurant-contacts p{margin-bottom: 10px!important; font-size: 18px!important}
.kr-cloud p:last-of-type, .restaurant-contacts p:last-of-type{margin-bottom: 20px}
.kr-cloud p span, .restaurant-contacts p span{color: #fba83c}
.restaurant-contacts p span.white{color: white}
.kr-cloud .button, .restaurant-contacts .button{height: 70px !important; width: 220px; display: flex; justify-content: center;
align-items: center; margin: 0 auto;}
.kr-cloud a.flamp, .restaurant-contacts a.flamp{width: 128px!important; height: 32px!important; display: block; 
background: url("/media/css/../images/flamp.png")no-repeat; background-size: cover;
margin: 15px auto 0!important}

.restaurant-contacts{position: absolute; position: absolute; z-index: 1; top: 50%; left: 50%; transform: translate(-50%, -50%)}
.restaurant-slider .kr-cloud{display: none!important}
.about-restaurant{padding: 70px 0 70px}
.about-restaurant .decoration-block.left .simpleParallax:first-of-type{top: 65px; left: 200px}
.about-restaurant .decoration-block.left .simpleParallax:nth-of-type(2){left: 590px; bottom: 60px}
.about-restaurant .decoration-block.right .simpleParallax:first-of-type{bottom: 50px; right: 180px;}
.menu-pdf{padding: 30px 0}
.menu-pdf .menu-items{display: flex; flex-wrap: wrap; justify-content: center}
.menu-pdf .menu-item{padding: 0 12px; text-align: center; height: 200px; display: flex; justify-content: space-between;
    flex-direction: column; margin-bottom: 10px}
.menu-pdf .menu-item .icon{position: relative; height: 130px}
.menu-pdf .menu-item img{display: block; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%)}
.menu-pdf .menu-item .button{text-transform: none; padding-top: 20px; background: #fdf1e3; border-radius: 15px;}
.restaurant-promo{padding: 30px 0 30px 0}
.restaurant-promo h1{text-align: center; color: #fba83c; margin-bottom: 25px;}
.restaurant-promo a{text-decoration: none;}
.restaurant-promo .text{display: inline-block; padding: 12px}
.restaurant-promo .swiper-slide .img-wrapper{overflow: hidden}
.restaurant-promo .swiper-slide img{transition: all 0.3s; display: block; max-width: 100%}
.restaurant-promo .swiper-slide:hover img{transform: scale(1.2)}

.promo-item{text-decoration: none; display: block; width: calc((100% - 40px)/3); float: left; margin-bottom: 20px;
    position: relative; z-index: 2}
.promo-item:not(:nth-child(3n)){margin-right: 20px}
.promo-item .img-wrapper{overflow: hidden;}
.promo-item img{transition: all 0.3s; display: block; max-width: 100%;}
.promo-item:hover img{transform: scale(1.2)}
.promo-item .text{display: inline-block; padding: 10px 10px 9px 10px; height: 60px}
.promo-banner{width: 100%; height: 630px; background-size: cover; background-position: top 54px center; 
background-repeat: no-repeat ; position: relative}
.promo-banner .wrapper-1600{position: static}
.banner-text{width: 535px; height: 522px; position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%);
    background: url("/media/css/../images/cloud-background.png")no-repeat center center;
    background-size: contain; padding: 150px 40px; text-align: center; color: #fff}
.banner-text .name{font: 30px "Oswald-Regular"; margin-bottom: 45px; color: #fba83c}
.banner-text .button{font-size: 16px; height: 70px; padding-top: 21px;}
#promo-conditions{padding: 50px 0;}
#promo-conditions .wrapper-1200{padding: 0 160px; box-sizing: border-box;}
#promo-details{position: relative; top: -100px;}
#registration{background: #fdf1e3;}

.jobs .yellow-background, .loyalty-program .yellow-background{padding: 30px 0;}
.jobs-banner .banner-text p{margin-bottom: 3px}
.jobs-banner .banner-text p.name, .loyalty-program-banner .banner-text p.name{margin-bottom: 15px}
.jobs-banner .button{margin-top: 15px}
.jobs .decoration-block{width: calc((100% - 900px)/2)}
.jobs .black-background-wrapper{padding: 10px 0 20px 0;}
.jobs .decoration-block.left .simpleParallax, .loyalty-program .decoration-block.left .simpleParallax{left: 20%}
.jobs .decoration-block.right .simpleParallax, .loyalty-program .decoration-block.right .simpleParallax{right: 20%}
.jobs .yellow-background .profile-button{margin: 0 auto; width: 250px; height: 90px; display: flex;
align-items: center; justify-content: center;}

.loyalty-program .decoration-block{width: calc((100% - 570px)/2)}
.loyalty-program .decoration-block.left .simpleParallax:nth-child(2){left: 55%; top: 260px}
.loyalty-program .decoration-block.right .simpleParallax:nth-child(2){right: 25%; top: 260px}
.loyalty-program .step{text-align: center; max-width: 400px; margin: 0 auto 20px auto; padding-top: 100px; background-repeat: no-repeat; 
background-position: top center}
.loyalty-program .step.step-1{background-image: url("/media/css/../images/step-1.png")}
.loyalty-program .step.step-2{background-image: url("/media/css/../images/step-2.png")}
.loyalty-program .step.step-3{background-image: url("/media/css/../images/step-3.png")}
.loyalty-program .step a{margin: -15px auto 50px auto;}
.loyalty-program .ranks{background: rgba(255, 72, 0, 0.5); margin-bottom: 20px}
.loyalty-program .ranks .wrapper-900{display: flex; justify-content: center; flex-wrap: wrap; padding: 30px 10px}
.loyalty-program .rank{width: 150px; padding: 0 15px 5px; text-align: center}
.loyalty-program .rank .bonuses{display: block; color: #fff; font: 27px 'Oswald-Regular'; margin-bottom: 3px;}
.loyalty-program .rank .name{display: block; font: 16px/18px "Rubik-Regular"}
.certificates p, .certificates h2{text-align: left!important}
img.certificate{display: block; float: left; margin-right: 70px; border-radius: 10px; max-width: 100%}
.certificates .right-column{float: left; width: calc(100% - 470px)}

.menu .menu-tabs{text-align: center; padding-top: 15px;}
.menu .menu-tabs span{font: 16px "Oswald-Regular"; text-transform: uppercase; display: inline-block; padding: 10px 15px; cursor: pointer}
.menu .menu-tabs span.active{color: #fff; background: url("/media/css/../images/marker-orange.png")no-repeat center center; background-size: 100% 100%}
.menu-slider{z-index: 2!important}

.black-background.delivery{padding: 30px 0 60px}
.delivery-page-top{text-align: center; margin-bottom: 10px;}
.delivery-conditions{height: 90px;}
.delivery-conditions p{margin-bottom: 0}
.delivery-zones{display: flex; flex-wrap: wrap; justify-content: center; margin-bottom: 50px}
.delivery-zone{padding: 20px 30px; text-align: center; max-width: 180px}
.delivery-zone.active{background: #24262f; color: #fff; border-radius: 15px;}
.delivery-zone span{display: block;}
.delivery-zone span:first-child{margin-bottom: 9px}
.delivery-zone span:nth-child(3){line-height: 18px; margin-bottom: 8px;}
.delivery-zone .order-sum{font-size: 33px; margin-bottom: 8px;}
.delivery-zone .order-sum.green{color: #76ce68}
.delivery-zone .order-sum.blue{color: #78c1ff}
.delivery-zone .order-sum.orange{color: #f0ad76}
.delivery-zone .order-sum.gray{color: #9b9b9b}
.delivery-zone .order-sum.red{color: #f48f8e}
.delivery-zone .delivery-cost{color: #fba83c}

.bottom-text{padding: 25px 20% 0 20%;}
.bottom-text > *:last-child{margin-bottom: 0;}

div.breadcrumbs{font-size: 13px; padding: 15px 0 0 0; margin-bottom: 15px;}
div.breadcrumbs a, div.breadcrumbs span{color: #a0a0a0; text-decoration: none;}
div.breadcrumbs a::after{content: " / "}
div.breadcrumbs a span:hover{text-decoration: underline}

div.top-block.category{margin-bottom: 30px;}
div.top-block.category h1{color: #24262f;}
div.top-block.category .editable{color: #a0a0a0; max-width: 850px;}
h1 a.back{background: url(/media/css/../images/svg/back.svg) left no-repeat; width: 16px; height: 16px; margin-right: 15px;
position: relative; top: -3px; display: inline-block;}



/* Pager */
div.pager{clear: both; margin-bottom: 25px;}
div.pager span{margin: 0 5px 0 0;}
div.pager a{display: inline-block; padding: 4px 11px 5px 11px; text-decoration: none;  margin-left: -3px; color: #24262f}
div.pager a.pager-prev, div.pager a.pager-next{padding: 6px 8px;}
div.pager a.active, div.pager a:hover{background-color: #fba83c; color: #fff; border-radius: 4px}

#previous-next{clear: both; border-bottom: 1px solid #e2e6e5; border-top: 1px solid #e2e6e5; padding: 27px 0 30px 0; height: 17px;}
#previous-next a.previous{padding: 0 0 0 18px; background: url(/media/css/../images/arrow-pager-left.png) left no-repeat;}
#previous-next a.next{float: right; background: url(/media/css/../images/arrow-pager-right.png) right no-repeat; padding: 0 18px 0 0;}

/* Forms */
form {margin: 0 auto; position: relative}
form textarea{height: 145px; resize: none; padding: 13px 20px}
input[type="text"], input[type="password"], input[type="email"], textarea, select{width: 100%;  border-radius: 4px;
    padding: 0 18px; position: relative; background-color: #fff; border: 1px solid #a0a0a0;}
input[type="text"], input[type="password"], input[type="email"], select{height: 40px; margin-bottom: 20px;}
input[type="button"], input[type="submit"]{-webkit-appearance: button; border: none; background: transparent}
textarea{margin-bottom: 25px}
select{cursor: pointer; padding: 0 30px 0 18px;
    background-image: url("/media/css/../images/svg/arrow-down.svg"); background-position: right 10px center;
    background-repeat: no-repeat; background-size: 15px 15px; -moz-appearance: none; text-indent: 0.01px;
    text-overflow: '';  appearance: none!important; -ms-appearance: none; -webkit-appearance: none; }
select::-ms-expand {display: none;}
input.required, textarea.required{background: #fff url(/media/css/../images/svg/placeholder-star.svg)no-repeat left 6px top 16px}
select.required{background: url(/media/css/../images/svg/placeholder-star.svg)no-repeat 8px center, url(/media/css/../images/svg/arrow-down.svg)no-repeat 95% center, #fff}
::placeholder{color: #24262f; opacity: 1}
:-ms-input-placeholder{color: #24262f; opacity: 1}
::-ms-input-placeholder{color: #24262f; opacity: 1}
.field-input{position: relative;}
.field-input > label{position: absolute; top: 6px; left: 20px; transition: all 0.5s}
input[type="text"]:focus ~ label, input[type="password"]:focus ~ label, input[type="email"]:focus ~ label,
input[type="text"].not-empty ~ label, input[type="password"].not-empty ~ label, input[type="email"].not-empty ~ label,
textarea:focus ~ label, textarea.not-empty ~ label {font-size: 14px; transform: translateY(-29px);}
.form-buttons{text-align: center}
.field-input img{border-radius: 5px; height: 40px; width: 120px}
.field-input input[name="captcha"]{width: calc(100% - 130px)!important; float: right}
#datepicker{background: #fff url("/media/css/../images/svg/calendar.svg")no-repeat center right 10px; cursor: pointer}

form.regular{max-width: 500px;}
form.regular div.field-name, .registration-form div.field-name{float: left; width: 175px; height: 60px; line-height: 40px}
form.regular div.field-input, .registration-form div.field-input{float: right; width: calc(100% - 175px);}
form.regular div.field-input input:not([type="checkbox"]){padding: 0 15px; height: 40px; width: 100%}
form.regular div.field-input textarea{padding: 8px 15px; width: 100%}
form.regular div.field-input select{padding: 2px 30px 3px 10px; width: 100%;}
form.regular div.field-input select option{padding: 2px 10px 3px 10px;}
form.regular input[name="phone"]{width: 185px !important; float: left}
form.regular div.buttons:not(.login-remember){padding-top: 15px; clear: both;}
form.regular div.buttons.login-remember{margin-top: 10px}
form.regular div.buttons input:not([type="checkbox"]){display: inline-block; min-width: 180px; padding: 0 30px; 
text-transform: uppercase; text-align: center; text-decoration: none; height: 46px; cursor: pointer;
background: #fba83c; border-radius: 15px; font: 18px/29px "Oswald-Regular"}
form.regular p.required-text, form.regular p.policy{margin: 15px 0;}
form.regular p.policy{font-size: 14px}
.black-background form.regular{}
form.regular .required{color: #ef454f;}
form.regular .note{font-size: 14px; padding-top: 10px}
form.regular .note p{margin: 0; line-height: 18px}
form.regular .note p.required-text{margin-bottom: 10px}
form.regular p.agree-check{display: flex; line-height: 19px; align-items: flex-start;}
form.regular p.agree-check input{margin-right: 5px;}

.registration-form{max-width: 530px; margin: 0 auto; padding: 10px 15px 20px 15px;}
.registration-form form{display: flex; flex-wrap: wrap;}
#phone-verification-section{clear: both; background: #fdf1e3; padding: 20px 0 15px 0; margin-bottom: 20px; width: 100%}
#phone-verification-section p.top-text{margin: 0 20px 22px 20px; color: #ef454f; font-size: 14px}
#phone-verification-section ul.verification-type{margin-bottom: 25px; border-bottom: 1px solid #a0a0a0; display: flex;}
#phone-verification-section ul.verification-type li{padding: 0 20px 10px 20px; cursor: pointer; position: relative; bottom: -1px;
text-transform: uppercase; font: 16px "Oswald-Regular";}
#phone-verification-section ul.verification-type li:first-child{margin-right: 25px}
#phone-verification-section ul.verification-type li span{padding-left: 22px;}
#phone-verification-section ul.verification-type li.phone span{background: url("/media/css/../images/svg/verify-phone.svg") left center no-repeat;}
#phone-verification-section ul.verification-type li.telegram span{background: url("/media/css/../images/svg/verify-telegram.svg") left center no-repeat;}
#phone-verification-section ul.verification-type li.active{border-bottom: 2px solid #444;}
#phone-verification-section div.verification-section{margin: 20px; display: none;}
#phone-verification-section div.verification-section.active{display: block;}
#phone-verification-section div.field-wrapper{margin: 0 20px}
#phone-verification-section div.field-wrapper div.field-name{width: 110px; margin: 0; font-size: 14px; height: auto;}
#phone-verification-section div.field-wrapper div.field-input{width: calc(100% - 110px); margin-bottom: 15px}
#phone-verification-section div.field-wrapper div.field-input input{margin: 0; background: #fff !important}

form  p.call-text{font-size: 14px; line-height: 18px; margin: 0 0 15px 0; clear: both;}
.registration-form input[name="password"]{margin-bottom: 5px!important}
.button.send-code, .button.confirm{background: #ef454f; width: 125px; min-width: 190px; height: 40px; 
line-height: 40px; border-radius: 4px; color: #fff; font-size: 14px; padding: 0}
.field-input.sms-code input{width: 80px!important; float: left; margin-bottom: 5px}
p.resending{font-size: 12px; clear: both; visibility: hidden; margin-bottom: 5px; position: relative; top: -4px}
#send-code-again{color: #ef454f; text-decoration: underline; cursor: pointer;}
#send-code-again:hover{text-decoration: none}

form.address-check{max-width: 100%!important; margin: 37px auto 0;}
form.address-check div.field-input, form.address-check div.form-buttons{float: left; margin-right: 1.5%}
form.address-check div.form-buttons{margin: -16px 0 0 0}
form.address-check input{margin-bottom: 0}
form.address-check div.street{width: calc(100% - 3% - 110px - 218px)}
form.address-check div.building{width: 110px}
.out-of-zone, .address-error{color: #ef454f;}
.in-zone{background: #76ce68; font-size: 15px; line-height: 19px; border-radius: 4px; padding: 8px 15px;}

div.form-success, div.form-errors{width: 100%; padding: 10px 20px 4px 20px; margin: 0 auto 30px; border-radius: 4px}
div.form-errors{background: #ef454f;}
div.form-success{background: #76ce68;}
div.form-success p{color: #24262f !important;}
div.form-errors p, div.form-success p{color: #fff; margin-bottom: 7px; font-size: 15px; line-height: 19px;}
form.regular div.field-input.error-field input, form.regular div.field-input.error-field select,
form.regular div.field-input.error-field textarea{background: #f9f3d7; border: 1px solid #eee7c6;}
.form-bottom-links{max-width: 500px; margin: 0 auto}
div.form-bottom-links a{margin: 0 20px 0 0;}
.black-background .form-bottom-links a{color: #fff}

/* Footer */
#footer{padding-top: 80px}
#footer .footer-top .contacts{display: flex; justify-content: space-between; margin-bottom: 45px;}
#footer .column{}
#footer .column:nth-child(3){text-align: right}
#footer .links{margin-top: 60px;}
#footer .links li{margin-bottom: 17px;}
#footer .links a{display: block; color: #0a8791; text-decoration: none; font: 18px "Oswald-Regular"; text-transform: uppercase;}
#footer .title{font: 18px "Oswald-Regular"; margin-bottom: 13px; text-transform: uppercase}
#scroll-up-button{width: 50px; height: 50px; background-color: rgba(0, 0, 0, 0.7); position: fixed; right: 35px; bottom: 25px;
    background-image: url("/media/css/../images/svg/up-arrow.svg"); background-repeat: no-repeat; background-position:  center center;
    z-index: 15; cursor: pointer; display: none; border-radius: 4px;}

.footer-bottom{display: flex; justify-content: space-between; font-size: 16px;}
.footer-bottom a{text-decoration: none}

#restoplace-wrapper-btn{right: 100px !important; bottom: 60px !important; z-index: 14 !important;}

div.fixed-menu{display: none; background: #fff; bottom: 0; left: 0; position: fixed; width: 100%; height: 50px;
min-width: 350px; z-index: 100; align-items: center;}
div.fixed-menu a.order-delivery{font: 18px/29px "Oswald-Regular"; text-transform: uppercase;}
div.fixed-menu span.name{font: 10px "Oswald-Regular"; text-transform: uppercase; display: block;
text-align: center;}
div.fixed-menu a{text-decoration: none;}
div.fixed-menu .mobile-gifts{background: #ef454f url("/media/css/../images/svg/tabbar/gift.svg") no-repeat top 9px center; color: #fff;}
div.fixed-menu .mobile-catalog{background: url("/media/css/../images/svg/tabbar/menu.svg") no-repeat top 9px center;}
div.fixed-menu .mobile-cart{background: url("/media/css/../images/svg/tabbar/cart.svg") no-repeat top 9px center; position: relative;}
div.fixed-menu .mobile-promos{background: url("/media/css/../images/svg/tabbar/promo.svg") no-repeat top 9px center;}
div.fixed-menu .mobile-login{background: url("/media/css/../images/svg/tabbar/user.svg") no-repeat top 9px center;}
div.fixed-menu .cart-quantity, div.fixed-menu span.gift-number{position: absolute; top: 5px; right: 20%; background: #fba83c; 
padding: 4px 6px; line-height: 1; border-radius: 50%; color: #fff; font: 12px/12px "Rubik-Regular"; text-align: center}

.autocomplete{ border: 1px solid #ccc; background: #fff; overflow: auto; padding: 10px 0; border-radius: 4px; min-width: 307px}
.autocomplete > div{padding: 2px 15px}
.autocomplete > div:hover{cursor: pointer; background: #eee}

#gifts-line{background: #ef3d33; position: fixed; width: 100%; bottom: 0; left: 0; height: 52px;
border-top: 2px solid #fba83c; z-index: 15; color: #fff; font-size: 14px; line-height: 21px;}
#gifts-line div.inner{max-width: 1600px; margin: 0 auto;}
#gifts-line div.text{padding: 3px 0 0 65px; background: url("/media/css/../images/svg/gift.svg") no-repeat top 3px left 10px; 
float: left; width: 450px; height: 47px;}
#gifts-line div.text span{color: #fba83c;}
#gifts-line div.scale{float: left; position: relative; width: calc(100% - 450px); height: 50px;}
#gifts-line div.scale > div{position: absolute; top: 0; left: 0; height: 50px;}
#gifts-line div.item{border-right: 1px solid #fff; z-index: 110}
#gifts-line div.item span.price{float: right; writing-mode: vertical-rl; font-size: 14px; margin: 8px 1px 0 0;}
#gifts-line div.item span.name{float: right; margin: 13px 0.5% 0 0; height: 23px;}
#gifts-line div.item span.name.active{background: url("/media/css/../images/svg/gift-marker.svg") no-repeat left top;
padding: 0 0 0 27px;}
#gifts-line div.cost{background: #d81c12; z-index: 101}
#gifts-line.mobile{display: block; bottom: 50px;}
#gifts-line.mobile div.text, #gifts-line.mobile div.item span.name{display: none}
#gifts-line.mobile div.scale{width: 100%;}
#gift-mobile-list{background: #fff; position: fixed; width: 100%;
min-height: 200px; bottom: 58px; left: 0; z-index: 130; padding: 12px 25px 20px 25px;}
#gift-mobile-list span.close{display: block; background: rgba(0, 0, 0, 0) url("/media/css/../images/svg/delete.svg") no-repeat;
background-size: contain; cursor: pointer; height: 30px; width: 30px; top: 15px; right: 15px;
position: absolute;}
#gift-mobile-list p.name{font: 30px "Oswald-Light"; margin-bottom: 7px;}
#gift-mobile-list div.section{margin-bottom: 4px;}
#gift-mobile-list div.section span{color: #ef454f;}

/* Client */
#client-menu-wrapper{position: absolute; left: 10px; top: 10px; z-index: 11}
#client-menu-wrapper + h1{position: absolute; top: 85px; left: 50%; transform: translateX(-50%)}
ul.client-menu{margin: 0}
ul.client-menu li{margin: 0; background: none; padding-left: 0}
ul.client-menu li a{color: #fba83c; text-decoration: none; display: inline-block; padding: 3px 10px; border-radius: 4px;}
ul.client-menu li.active a{background: #24262f;}
ul.client-menu li:hover a{text-decoration:none}
ul.client-menu li.active:hover a{cursor: auto}
.client-form, .change-password-form{padding: 10px 0 20px; max-width: 530px; margin: 0 auto}
.recover-form, .new-password{padding: 10px 15px 20px 15px}

.order-history-block{padding: 0 0 30px 0;}
.table-wrapper{overflow-x: auto}
table.order-history{width: 100%;max-width: 100%; margin: 0 0 25px 0;}
table.order-history th{text-transform: uppercase; padding: 7px 10px; text-align: left; font: 15px "Oswald-Regular";
border-bottom: 1px solid #ccc; color: #fba83c;}
table.order-history td{padding: 10px; border-bottom: 1px solid #ccc;}
table.order-history td.order-number{width: 143px !important}
table.order-history td.order-number span{cursor:pointer; text-decoration: underline; padding-left:10px;}
table.order-history tr.details{display: none;}
table.order-history td.details-wrapper{padding:0 !important}
table.order-history td.details-wrapper > div{background:#fff; color: #333; background: #fdf1e3;
padding-bottom: 10px; font-size: 14px;}
table.order-history td.details-wrapper th{text-transform: none; background: #ddd; font-family: "Oswald-Regular"; 
border: none; color: #24262f; padding: 12px 15px 12px 15px;}
table.order-history td.details-wrapper td{border: none; padding: 5px 15px;}
.no-orders{margin: 0}

#order-history{display: none; margin: 0 2% 15px 2%; border-bottom: 1px solid #eee;}
#order-history+p{color: #fff}
#order-history div.order{margin: 0 0 0 0; padding: 10px 0 0 0; border-top: 1px solid #eee;}
#order-history div.order div.title{line-height: 1.5; position: relative; margin: 0 3% 10px 0; cursor: pointer;
background: url("/media/css/../images/mobile/arrow-menu-blue.png") right center no-repeat;}
#order-history div.order div.title span{background: #fba83c; color: #fff; padding: 0 6px;}
#order-history div.order div.content{background: #eee; padding: 0 3%; margin: 7px 0 0 0; display: none;}
#order-history div.order div.content div.item{border-bottom: 1px solid #fff; padding: 7px 0 2px 0;}
#order-history div.order div.content div:last-child{border: none;}
#order-history div.order div.content div.item p{margin-bottom: 5px;}

/* Modal */
#modal-overlay{width: 100%; height: 100%; position: fixed; z-index: 16; background: #24262f; opacity: 0.7;  top: 0;
left: 0; display: none;}

div.modal-window{display: none; background: #fff; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); 
z-index: 17; max-height: 100vh; border-radius: 15px; overflow-y: auto;}
.modal-content{max-height: calc(100vh - 20px);  padding: 35px 50px 35px; width: 600px;}
div.modal-window .title{margin-bottom: 20px; text-align: center; font: 22px "Oswald-Regular"}
div.modal-window .title span{}
div.modal-window .close{cursor: pointer; background: url(/media/css/../images/svg/delete.svg) no-repeat; background-size: contain;
width: 30px; height: 30px; display: block; position: absolute; right: 20px; top: 15px;}
div.modal-window img.captcha-image{display: block; margin: 0 auto 10px auto;}

div.modal-window div.form-errors, div.modal-window div.form-sent{background: #ef454f; padding: 10px 15px 4px 15px;
margin: 0 auto 20px; /* max-width: 425px; */ border-radius: 4px}
div.modal-window div.form-errors p, div.modal-window div.form-sent p{color: #fff; margin: 0 0 7px 0;
font-size: 15px; line-height: 19px;}
div.modal-window div.form-sent{background: #76ce68;}
div.modal-window div.form-sent p{color: #24262f;}
div.modal-window a{text-decoration: none; color: #fba83c;}
div.modal-window form p{font-size: 14px}
div.modal-window form p.agree-check{display: flex; line-height: 19px; align-items: flex-start;}
div.modal-window form p.agree-check input{margin-right: 5px;}
div.modal-window form textarea{margin-bottom: 5px}

div.modal-content::-webkit-scrollbar{width: 6px; background-color: #f5f5f5; position: relative; left: -30px; height: 90%}
div.modal-content::-webkit-scrollbar-thumb{background-color: #24262f}

#booking-date{background: #fff url("/media/css/../images/svg/calendar.svg")no-repeat center 95%; background-size: 15px 15px}

#modal-city-choice{text-align: center; background: #fff;}
#modal-city-choice #choose-other-city{text-decoration: underline; cursor: pointer; margin: 9px 0 0 15px}
#modal-city-choice #choose-other-city:hover{text-decoration: none}

#modal-profile .phone, #modal-profile .age{width: calc((100% - 20px)/2); float: left}
#modal-profile .phone{margin-right: 20px}
#modal-profile ul{padding: 10px 0 5px 22px; margin-bottom: 5px;}
#modal-profile li{background: none; list-style: none; padding: 0; margin-bottom: 12px;}
#modal-profile li input{top: 0; margin-right: 5px;}
#modal-profile #profile-position{padding-left: 21px; cursor: pointer;
background: url(/media/css/../images/svg/placeholder-star.svg)no-repeat 8px center, url(/media/css/../images/svg/arrow-down.svg) no-repeat 95% center, #fff;}
#modal-profile #position-options{background: #fff; margin: -25px 0 23px 0; display: none;}
#modal-profile div.subheader{color: #fba83c; margin-bottom: 15px;}
#modal-profile div.list-header{background: url(/media/css/../images/svg/placeholder-star.svg) no-repeat top 8px left 8px;
padding: 0 0 5px 22px;}
span.arrow{}

#modal-login .modal-content{width: 500px;}
/* #modal-login form{width: 325px} */

.buttons.login-remember{font-size: 14px; margin-bottom: 15px}
.buttons.login-remember label{position: relative; bottom: -2px;}
.buttons.login-remember a.recover-password{float: right}
.buttons.submit{text-align: center}

#modal-address-check{width: 830px;}
#modal-address-check .modal-content{padding: 35px 65px}
#modal-address-check input[type="radio"]{margin-right: 5px}
#modal-address-check .radio-tab{display: inline-block; margin: 0 20px 5px 0}
#modal-address-check .form-content{margin-top: 15px}
#modal-address-check .field-name{width: 100%; margin-bottom: 5px}
#modal-address-check .restaurant-select{width: calc(100% - 1.5% - 200px)}
.input-subtitle span{font-size: 18px; padding-right: 30px; background: url("/media/css/../images/emoji.png")no-repeat right center;
    background-size: 25px 25px; line-height: 25px;}

#banner-modal{background: none; overflow: hidden; padding: 0; max-width: 100vw;}
#banner-modal img{display: block; max-width: 100vw}
#modal-ok{position: absolute; bottom: 4.4%; left: 50%; transform: translateX(-50%); display: flex;
justify-content: center; align-items: center;}

/* Cart */
.yellow-background.cart{padding: 10px 0 30px 0}
.yellow-background.checkout{padding: 35px 0 0 0}
#content.cart{padding-bottom: 90px;}
.cart-wrapper{max-width: 1000px; margin: 0 auto;}
#cart-products{margin: 0 50px; padding: 20px 0;}
#cart-products div.wrapper{float: left; width: 100%; border-bottom: 1px solid #e0e0e0; position: relative}
#cart-products div.wrapper:first-child{border-top: 1px solid #e0e0e0;}
#cart-products div.wrapper.header{text-transform: uppercase;  text-align: left; }
#cart-products div.wrapper.header > div{fpadding: 12px 1% !important;}
#cart-products div.wrapper > div{float: left; padding: 20px 20px 20px 0}
#cart-products div.image{width: 160px;}
#cart-products div.image img{display: block; width: 100%; border-radius: 15px;}
#cart-products div.description{width: calc(100% - 438px - 10%);}
#cart-products div.description span.name{display: block; margin: 12px 0 7px 0; font: 18px/20px "Oswald-Regular"; 
text-transform: uppercase;}
#cart-products div.description .additional-ingredients span{display: block; font-size: 15px;}
#cart-products div.price{width: 18%; text-align: right; padding-top: 40px !important; font: 18px/20px "Oswald-Regular";}
#cart-products div.price del{color: #fc474c; font-size: 15px; margin-right: 2px; font: 18px/20px "Oswald-Regular";}
#cart-products div.quantity{width: 180px;}
#cart-products div.quantity > div{display: flex; width: 130px; justify-content: space-between; align-items: center;}
#cart-products div.wrapper.gift div.quantity > div{justify-content: center;}
#cart-products div.quantity > div > *{}
#cart-products div.quantity input.number{padding: 0; text-align: center; font: 18px/20px "Oswald-Regular";
width: 50px; margin: 0; border: none;}
#cart-products div.quantity span.plus, #cart-products div.quantity span.minus{cursor: pointer; border-radius: 50%;
height: 35px; width: 35px;}
#cart-products div.quantity span.plus{background: #fba83c url("/media/css/../images/svg/plus.svg") no-repeat center;}
#cart-products div.quantity span.minus{background: url("/media/css/../images/svg/minus.svg") no-repeat center;
border: 2px solid #a0a0a0;}
#cart-products div.cost{width: 98px; font-size: 20px; padding-top: 23px !important; font: 18px/20px "Oswald-Regular";}
#cart-products div.cost > span{margin-top: 9px; display: inline-block;}
#cart-products div.quantity span.number, #cart-products div.cost, #cart-products div.price{user-select:none; 
-moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none;}
#cart-products .actions{min-width: 37px; width: 10%; padding-top: 27px!important;}
#cart-products .actions .remove{display: inline-block; width: 30px; height: 30px; cursor: pointer;
    background: url("/media/css/../images/svg/delete.svg") no-repeat; background-size: contain; float: right;}

.gifts{padding: 30px 0; background: #fdf1e3;}
.gifts h2{color: #24262f; text-transform: uppercase; font-size: 27px; text-align: center;}
.gifts .wrapper{flex-wrap: wrap; display: flex; justify-content: space-between; max-width: 620px;
margin: 0 auto 10px auto;}
.gifts .gift{padding: 20px 38px 20px 50px; border: 2px solid #a0a0a0; border-radius: 4px; color: #a0a0a0;
margin: 0 0 20px 0; width: 300px; background: url("/media/css/../images/svg/radio-passive.svg") no-repeat left 10px top 17px;
font: 16px/18px "Oswald-Regular"; text-transform: uppercase;}
.gifts .gift p{margin-bottom: 10px; color: #a0a0a0}
.gifts .gift.active{border-color: #ef454f; background-image: url("/media/css/../images/svg/radio-active.svg");
 cursor: pointer;}
.gifts .gift.active p{color: #ef454f}
.gifts .gift.active span{color: #24262f}
.gifts .gift.selected{border-color: #ef454f; background-image: url("/media/css/../images/svg/radio-selected.svg");
 cursor: pointer;}
.gifts .gift.selected p{color: #ef454f}
.gifts .gift.selected span{color: #24262f}
.gifts .separator{background: #a0a0a0; height: 1px; margin: 0 20% 20px 20%;}
form.promo-code{width: 330px; margin: 0 auto}
form.promo-code input[type="text"] {padding: 10px 25px;  border-radius: 4px;  width: 205px; float: left; margin-bottom: 10px}
form.promo-code input[type="button"] {padding: 0 15px 0 15px; border-radius:4px; background: #fba83c; float: left;
cursor: pointer; font-size: 14px; text-transform: uppercase; width: 125px; height: 40px; color: #24262f;
position: relative; z-index: 1; right: 3px; font: 18px "Oswald-Regular";
border-top-left-radius: 0; border-bottom-left-radius: 0;}
form.promo-code + .warning{color: #ef454f; font-size: 16px; text-align: center;}
form.promo-code + .promo-code-success{color: #43a034; font-size: 16px; text-align: center;}

.cart-additional{padding: 25px 0 20px 0}
.cart-additional h2{color: #24262f; text-transform: uppercase; font-size: 27px; text-align: center;}
#content.cart h2 + p{text-align: center; margin-bottom: 15px; color: #595a61;}
.cart-additional-swiper{max-width: 800px; margin: 0 auto}
.cart-additional-swiper .image{margin-bottom: 10px;}
.cart-additional-swiper .image img{max-width: 100%; display: block; border-radius: 4px;}
.cart-additional-swiper .product-info{padding: 0px 10px 0px 10px; height: 115px; display: flex; flex-direction: column;
justify-content: space-between; align-items: center;}
.cart-additional-swiper .name{font: 15px/18px "Oswald-Regular"; text-transform: uppercase; text-align: center;}
.cart-additional-swiper .weight{color: #fff; font-size: 13px; margin-bottom: 10px}
.cart-additional-swiper .price{color: #fba83c; width: 50%; float: left}
.cart-additional-swiper .cart.button{font-family: "Oswald-Regular"; width: 112px; min-width: 112px; height: 54px; line-height: 57px;
    float: right; position: relative;}
.cart-additional .swiper-button-prev{left: 0; width: 30px; height: 50px}
.cart-additional .swiper-button-next{right: 0; width: 30px; height: 50px}
.cart-additional .slider-wrapper{padding: 0 40px}

.final-sum{background: #24262f; color: #fff; padding: 20px 0;}
.final-sum .wrapper-900{display: flex; justify-content: space-between; align-items: center; max-width: 720px;}
.final-sum.cart{font: 32px/42px "Oswald-Light"; text-transform: uppercase; position: fixed; width: 100%; left: 0; bottom: 0;
z-index: 10;}
.final-sum.cart .cart-total{display: inline-block; margin: 0 15px 0 0;}
.cart-navigation{display: flex;}
.cart-navigation input.order{font: 18px/29px "Oswald-Regular"; color: #24262f; border-radius: 15px; text-transform: uppercase; 
height: 48px; padding: 1px 33px 0 15px; background: #fba83c url("/media/css/../images/svg/next-arrow.svg") right 12px center no-repeat;
cursor: pointer;}

div.empty-cart-text{padding: 15px 10px; clear: both;}
p.cart-minimal-amount{margin-bottom: 15px;}
div.order-authorization-required{margin-bottom: 30px;}
#order-back-to-cart{float: left; background: #2e3638;}

#place-order-form{max-width: 100%; padding: 30px 0 0 0;}
#place-order-form .black-background{padding: 10px 0 20px 0;}
#place-order-form .wrapper-540{padding: 0; margin-bottom: 10px;}
#place-order-form .black-background .field-input{width: 100%}
textarea[name="client_comment"]{height: 40px}
input[name="client_persons"]{width: 85px!important;}
input[name="secret_code"]{width: 120px!important;}
.delivery-options{}
.delivery-options h2{color: #24262f; text-transform: uppercase; font-size: 25px;}
.radio-buttons{margin-bottom: 20px; display: flex; justify-content: space-between;}
.radio-buttons.delivery{margin-bottom: 20px;}
.radio-button {border: 2px solid #a0a0a0; float: left; border-radius: 4px;}
.radio-button.off{border: 2px solid #a0a0a0888;}
.radio-button.off p{color: #a0a0a0888;}
.radio-button, .radio-button input[type="radio"] {position: relative;  display: block; width: 49%; height: 100px;}
.radio-button input[type="radio"] {opacity: 0; z-index: -1; height: 100%!important; }
.radio-button label {display: block; width: 100%; height: 100%; border-radius: 5px; position: absolute; top: 0; left: 0}

.radio-button label p{font-size: 13px; line-height: 16px;}
.radio-button label p.red{color: #ef454f !important;}

.radio-buttons.delivery label p{height: 100%; top: 0; transform: none; padding: 15px 14px 15px 14px !important;
color: #595a61;}
.radio-button label span{display: block; background: url("/media/css/../images/svg/radio-yellow.svg") left center no-repeat;
font: 18px/20px "Oswald-Regular"; text-transform: uppercase; height: 24px; padding-left: 35px; margin-bottom: 6px;
color: #24262f;}
.radio-button label span span.star{display: inline; margin: 0 0 0 7px; color: #ef454f;}
.delivery-options .client-address .field-name{width: 100px}
.delivery-options .client-address .field-input{width: 113px!important; padding-right: 18px}
.delivery-options .client-address .field-input.house, .delivery-options .client-address .field-input.floor{padding-right: 0}
.delivery-options .client-address .field-input.street{width: 325px!important}
.delivery-options .client-city{font-size: 14px; margin-bottom: 2px}
.delivery-options .client-city.delivery{padding-left: 100px !important}
.delivery-options .delivery-cost{margin-bottom: 30px; top: -12px; background: #76ce68; font-size: 15px;
line-height: 19px; border-radius: 4px; padding: 8px 15px;}
#place-order-form .pickup-restaurant .field-input{width: 100%}
#place-order-form .radio-buttons.payment{width: 100%}
#content .client-address .field-input{float: left}
#place-order-form .datetime-select .field-input{width: 300px; float: left}
#place-order-form .datetime-select .field-input:first-child{margin-right: 40px}
.payment-comment input{width: 105px; margin: 0 7px 0 10px}
.payment-comment{margin-bottom: 38px}
#place-order-form .field-input .client-comment{width: 100%}
.radio-button.active{border-color: #fba83c;}
.radio-button.active label span{background-image: url("/media/css/../images/svg/radio-yellow-selected.svg");}
div.radio-buttons.order-time label{padding: 15px 14px !important; display: flex; align-items: center;}
div.radio-buttons.order-time label p, div.radio-buttons.payment .radio-button label p{
background: url("/media/css/../images/svg/radio-yellow.svg") left center no-repeat; font: 18px/20px "Oswald-Regular"; 
text-transform: uppercase; height: 24px; margin: 0; padding-left: 35px;}
div.radio-buttons.order-time div.active label p, div.radio-buttons.payment .radio-button.active label p{
background-image: url("/media/css/../images/svg/radio-yellow-selected.svg");}
div.radio-buttons.payment{flex-wrap: wrap;}
div.radio-buttons.payment .radio-button{/* width: calc((100% - 40px) / 3);*/ height: 70px; margin: 0 0 10px 0;}
div.radio-buttons.payment .radio-button label{display: flex; align-items: center; padding: 15px 14px;}
div.radio-buttons.payment .radio-button label p{font: 16px/19px "Oswald-Regular"; height: auto;
min-height: 24px; padding-top: 1px;}
div.radio-buttons.payment .radio-button.off{cursor: default;}
div.radio-buttons.payment .radio-button.off label p{color: #a0a0a0; 
background-image: url("/media/css/../images/svg/radio-passive.svg");}

#place-order-form .final-sum{text-align: left; padding: 30px 0;}
#place-order-form .cart-total{width: 455px; position: relative}
#place-order-form .cart-total .name, #place-order-form .cart-total .value{display: inline-block; margin-bottom: 10px;
font: 18px/20px "Oswald-Regular";}
#place-order-form .cart-total .name{width: 275px; text-transform: uppercase;}
#place-order-form .big{margin-top: 15px; color: #fba83c;}
#place-order-form .cart-total .buttons{position: absolute; right: -188px; bottom: 0}
#place-order-form p.resending{margin-bottom: 0;}
#place-order-form div.star-text{clear: both; margin: 0 0 17px 0; position: relative; font-size: 14px;}
#place-order-form div.star-text.payment{color: #ef454f; margin-bottom: 13px;
background: url("/media/css/../images/svg/info.svg") top 4px left no-repeat; padding-left: 24px;}
#place-order-form .final-sum a{color: #fba83c;}

div.order-complete{padding: 50px 10px 25px 10px;}
div.order-complete ul{padding: 0;}
div.order-complete > p{margin-bottom: 7px;}
div.order-complete h3{padding-top: 12px; color: #fba83c;}
div.order-complete table.order{width: 100%; max-width: 100%; margin: 5px 0 25px 0;}
div.order-complete table.order th{text-transform: uppercase; padding: 7px 10px; text-align: left; 
font: 15px "Oswald-Regular"; border-bottom: 1px solid #ccc; color: #fba83c;}
table.order-history td{padding: 10px; border-bottom: 1px solid #ccc;}
div.order-complete table.order td{padding: 10px; border-bottom: 1px solid #ccc;}
div.order-complete-total{text-transform: uppercase; font-family: "Oswald-Regular";}
div.order-complete-total p{margin-bottom: 8px;}
div.order-complete-note{font-size: 13px;}
#pay-online-button{background: #ff5d22; text-decoration: none; display: inline-block; padding: 8px 15px;
border-radius: 4px; margin: 10px 0 12px 0; cursor: pointer; color: #fff; font: 18px/29px "Oswald-Regular";
text-transform: uppercase;}

div.order-complete-email{background: #fdf1e3; max-width: 670px; padding: 15px 27px; border-radius: 10px;
margin: 40px auto -35px auto;}
div.order-complete-email > p{font-size: 14px; margin-bottom: 7px;}
div.order-complete-email > p > span{color: #ef454f;}
div.order-complete-email form{display: flex; border: 1px solid #a0a0a0; border-radius: 5px;
width: 370px; height: 37px; margin: 0; overflow: hidden;}
div.order-complete-email form input{border: none; width: 270px; height: 100%}
div.order-complete-email form span{font: 14px "Oswald-Regular"; text-transform: uppercase;
background: #fba83c; width: 100px; display: flex; align-items: center; justify-content: center;
height: 100%; cursor: pointer; border-left: 1px solid #a0a0a0;}
div.order-complete-email div.form-errors, div.order-complete-email div.form-success{margin: 15px 0 10px 0}

#menu-images-slider{padding-bottom: 70px; position: relative;}
#menu-images-slider div.image-current{width: 100%; height: 810px; position: relative;
background: url("/media/css/../images/loader.png") center no-repeat;}
#menu-images-slider div.image-current img{max-width: 100%; display: block; margin: 0 auto 10px auto;}
#menu-images-slider div.control{width: 48px; height: 80px; position: absolute; cursor: pointer; top: 50%;
margin-top: -40px; display: none;}
#menu-images-slider div.control.prev{background: url("/media/css/../cloudslider/img/left_arrow.png") center no-repeat;
left: 30px;}
#menu-images-slider div.control.next{background: url("/media/css/../cloudslider/img/right_arrow.png") center no-repeat;
right: 30px;}
#menu-images-slider div.bullets{padding: 15px 0; display: flex; flex-wrap: wrap; justify-content: center;}
#menu-images-slider div.bullets span{width: 10px; height: 10px; cursor: pointer; margin: 0 4px 7px 4px;
background: #fff; border-radius: 5px; border: 2px solid #aaa;}
#menu-images-slider div.bullets span.active{background: #aaa;}

.checkbox-ios{display: inline-block; height: 20px; line-height: 20px; margin-right: 10px; position: relative;
vertical-align: middle; font-size: 14px; user-select: none;}
.checkbox-ios .checkbox-ios-switch{position: relative; display: inline-block; box-sizing: border-box;         
width: 40px; height: 20px; border: 1px solid rgba(0, 0, 0, .1); border-radius: 25%/50%;
vertical-align: top; background: #eee; transition: .2s;}
.checkbox-ios .checkbox-ios-switch:before{content: ''; position: absolute; top: 1px; left: 1px;  
display: inline-block; width: 17px; height: 16px; border-radius: 50%; background: white;
box-shadow: 0 3px 5px rgba(0, 0, 0, .3); transition: .15s;}
.checkbox-ios input[type=checkbox]{display: block; width: 0; height: 0; position: absolute;
z-index: -1; opacity: 0;}
.checkbox-ios input[type=checkbox]:not(:disabled):active + .checkbox-ios-switch:before{
box-shadow: inset 0 0 2px rgba(0, 0, 0, .3);}
.checkbox-ios input[type=checkbox]:checked + .checkbox-ios-switch{
background: limegreen;}
.checkbox-ios input[type=checkbox]:checked + .checkbox-ios-switch:before{
transform:translateX(20px);}
.checkbox-ios input[type="checkbox"]:not(:disabled) + .checkbox-ios-switch{
cursor: pointer; border-color: rgba(0, 0, 0, .3);}
.checkbox-ios input[type=checkbox]:disabled + .checkbox-ios-switch{
filter: grayscale(70%); border-color: rgba(0, 0, 0, .1);}
.checkbox-ios input[type=checkbox]:disabled + .checkbox-ios-switch:before{
background: #eee;}
.checkbox-ios.focused .checkbox-ios-switch:before{
box-shadow: inset 0px 0px 4px #ff5623;}

#cookies-options{position: fixed; width: 480px; padding: 17px 20px; z-index: 20; background: #fff;
box-shadow: 0 1px 5px rgba(0, 0, 0, .3); border-radius: 10px; font-size: 13px; color: #595a61;
bottom: 10px; left: 8%}
#cookies-options p{line-height: 16px; margin-bottom: 0}
#cookies-options p a{color: #0a8791; text-decoration: none}
#cookies-options div.message div.title, #cookies-options div.settings div.title p{
font-weight: bold; margin-bottom: 3px;}
#cookies-options div.message p{margin-bottom: 14px;}
#cookies-options div.settings{display: none;}
#cookies-options div.settings > div{border-bottom: 1px solid #ccc; margin-bottom: 14px;
padding-bottom: 16px;}
#cookies-options div.settings div.cookie-header{font: 16px/20px "Oswald-Regular"; text-transform: uppercase;
margin-bottom: 10px;}
#cookies-options div.settings div.title{display: flex; justify-content: space-between;
margin-bottom: 5px;}
#cookies-options div.settings div.title div.tumbler{color: limegreen}
#cookies-options div.settings div.title div.tumbler label{margin-left: 8px;}
#cookies-options div.buttons{display: flex; border: none !important; padding-bottom: 6px !important;
margin-bottom: 0 !important; justify-content: flex-end}
#cookies-options div.buttons span{background: #24262f; color: #fba83c; height: 28px; padding: 0 15px 1px 15px;
display: flex; justify-content: center; align-items: center; border-radius: 9px; cursor: pointer; width: 100px}
#cookies-options div.buttons span.tune{margin-left: 40px; background: none; color: #595a61;}
#cookies-options div.settings > div p a{color: #24262f; font-weight: bold}
/* End of file */


/* File data: responsive-catalog.css */


/* Index catalog */
.catalog-items{margin-top: 30px; display: flex; justify-content: space-between; flex-wrap: wrap}
.catalog-item{display: block; position: relative; width: calc((100% - 60px)/3); overflow: hidden; max-height: 428px;
     float: left; margin: 0 10px 20px}
.catalog-item.big{max-height: 448px}
.catalog-item.big{width: calc((100% - 60px)/3*2 + 20px)}
.catalog-item .image-wrapper{max-height: 347px; overflow: hidden}
.catalog-item.big .image-wrapper{max-height: 448px}
.catalog-item img{width: calc(100% + 60px); transition: transform 0.35s; transform: translate3d(-50px,0,0); display: block}
.catalog-item .name{padding-top: 15px; transition: transform 0.35s; height: 80px}
.catalog-item .name span{background: url("/media/css/../images/marker.png")no-repeat; background-size: 100% 100%; padding: 13px 65px 15px 30px;
    display: inline-block; font: 22px "Oswald-Regular"; text-transform: uppercase;}
.catalog-item:hover img{transform: translate3d(0,0,0)}
.catalog-item:hover .name{transform: translate3d(50px,0,0)}
.catalog-item.big .name{position: absolute; bottom: 25px; left: 3px}
.black-background .decoration.left, .catalog .decoration.left{bottom: -15px; left: 120px}
.black-background .decoration.right, .catalog .decoration.right{bottom: -45px; right: 120px}

/* Products list */
.delivery-menu{padding: 0; background: #24262f; background-size: 100% 100%;}
.delivery-menu.fixed{position: fixed; top: 0; left: 0; width: 100%; z-index: 5;}
.delivery-menu ul{width: 100%;}
.delivery-menu li{display: inline-block; color: #fff; font: 16px/20px "Oswald-Regular"; text-transform: uppercase;}
.delivery-menu li:hover, .delivery-menu li.active{color: #fba83c;}
.delivery-menu li a{text-decoration: none; padding: 11px 12px 12px 12px; display: block;}
.delivery-menu .wrapper-1600{position: relative}
.menu-scroll-left, .menu-scroll-right{width: 18px; height: 18px; position: absolute; top: 50%; 
transform: translateY(-50%); background-size: contain; background-repeat: no-repeat; background-position: center; 
cursor: pointer; z-index: 10;  display: none}
.menu-scroll-left{left: 5px; background-image: url("/media/css/../images/svg/arrow-left.svg")}
.menu-scroll-right{right: 5px; background-image: url("/media/css/../images/svg/arrow-right.svg");}

#catalog-products div.empty{height: 0;}
#catalog-products{display: flex; justify-content: space-between; flex-wrap: wrap;}

.product{margin: 0 0 25px 0; width: 385px; position: relative;}
.product div.image{height: 288px; overflow: hidden; position: relative; border-radius: 15px; margin-bottom: 15px;
cursor: pointer;}
.product div.image.white-background{background: #fff}
.product div.image img:first-child{display: none;}
.product div.image img:last-child{transition: all 0.3s;}
.product div.image img{width: 100%; display: block; top: -69%; position: relative;}
.product:hover div.image img:last-child{transform: scale(1.1)}
img.default-catalog-image{bottom: auto; top: 50%; transform: translateY(-50%)}
.product div.image a{display: block; vertical-align: middle; width: 100%; position: relative; height: 220px;}
.product div.image a img{display: block; margin: 0 auto; max-width: 100%}
.product .product-info{height: 180px;}
.product .product-info .modifires{margin-top: 10px}

.product.promo-of-the-day, .product.city-promo{background: #ff4800; border-bottom: 2px solid #ff4800}
.product.promo-of-the-day:hover .product-info, .product.city-promo:hover .product-info{background: none;}
.product .countdown p{font-size: 13px; margin-bottom: 0; margin-top: 8px}
span.flags{position: absolute; top: 0; left: 0; right: 0; width: 100%;  display: block; z-index: 2;}
span.flags span{display: block; position: absolute; top: 10px; right: 5px}
span.flags span.day{background: url(/media/css/../images/flag-promo.png) no-repeat; width: 150px; height: 45px;}
span.flags span.hit{background: url(/media/css/../images/flag-hit.png) no-repeat; width: 58px; height: 58px;}
span.flags span.new{background: url(/media/css/../images/flag-new.png) no-repeat; width: 58px; height: 58px;}
span.flags span.hearts{background: url(/media/css/../images/flag-hearts.png) no-repeat; width: 130px; height: 105px; top: -20px;
    left: -15px; opacity: 0; transition: all 0.3s}
span.flags span.fire{background: url(/media/css/../images/flag-fire.png) no-repeat; width: 110px; height: 126px; top: -20px;
    left: -15px; opacity: 0; transition: all 0.3s}
/*
.product.new:hover .product-info{background: url("/media/css/../images/hover-purple.png") no-repeat; background-size: 100% 100%}
.product.hit:hover .product-info{background: url("/media/css/../images/hover-orange.png") no-repeat; background-size: 100% 100%}
*/
.product.hit:hover span.hearts{opacity: 1}
.product.new:hover span.fire{opacity: 1}
.product:hover div.name{color: #fba83c}

.product div.name{font: 18px/20px "Oswald-Regular"; text-transform: uppercase; margin-bottom: 3px;}
.product div.name a{text-decoration: none;}
.product .weight, .product .description{font: 14px/20px "Rubik-Regular"; color: #595a61;}
.product .bottom{position: absolute; bottom: 0; left: 0; width: 100%; display: flex; justify-content: space-between; align-items: center;
height: 70px;}
.product div.price{}
.product div.price span.old-price{color: #ef3d33; text-decoration: line-through; font: 18px/20px "Oswald-Regular";
margin-right: 5px;}
.product div.price span.price{font: 18px/20px "Oswald-Regular"; color: #fba83c}
.product div.buttons{width: 155px; display: flex; justify-content: flex-end;}
.product div.buttons span.cart{font: 20px/75px "Oswald-Regular"; color: #000; width: 155px; min-width: 155px;
margin: 0}
.product .quantity, #product-modal .quantity{height: 40px; width: 120px; display: flex; align-items: center; justify-content: space-between;
margin-right: 20px;}
div.product div.quantity span.plus, div.product div.quantity span.minus, #product-modal .quantity span.plus, #product-modal .quantity span.minus {
    cursor: pointer; border-radius: 50%; height: 35px; width: 35px;}
.quantity span.plus{background: #fba83c url("/media/css/../images/svg/plus.svg") no-repeat center; border: 2px solid #fba83c;}
.quantity span.minus{background: #fff url("/media/css/../images/svg/minus.svg") no-repeat center; border: 2px solid #a0a0a0;}
.quantity span.number{font: 18px/20px "Oswald-Regular"; color: #595a61; width: 40px; text-align: center;}

/* Product modal-window */
#product-modal{width:1100px; height:600px; min-width: 360px; border-radius: 4px; overflow: visible;}
#product-modal .modal-content{padding: 0; position: relative; overflow: visible; width: auto; height: 100%}
#product-modal div.main{display: flex; flex-direction: row; justify-content: space-between;}
#product-modal div.image{width:400px; position:relative; height:100%}
#product-modal div.image img{max-width: 100%; display: block}
#product-modal div.image img.small-default-image{display: none}
#product-modal div.controls{width:calc(100% - 400px); height:100%; margin:0; padding:40px 5.5%}
#product-modal div.controls table{font: 14px/20px "Rubik-Regular"; color: #a0a0a0;}
#product-modal .close{right: 20px; top: 20px;}
#product-modal h2{font: 18px/20px "Oswald-Regular"; text-align:left; margin:0 0 3px 0; text-transform: uppercase;}
#product-modal h3{font-size:20px;}
#product-modal .weight{font: 14px/20px "Rubik-Regular"; margin-bottom: 10px; color: #595a61;}
#product-modal div.description{margin:0 10% 18px 0; font: 14px/20px "Rubik-Regular"; color: #595a61;}
#product-modal form{max-width: 100%}
#product-modal input{margin: 0 15px 20px 0}
#product-modal div.buttons{width: 100%; display: flex; padding: 24px 5%; background: #fdf1e3; justify-content: space-between;
align-items: center; margin-bottom: 10px; height: 78px;}
#product-modal div.product-price{font: 18px/20px "Oswald-Regular";}
#product-modal div.product-price span.old-price{color: #ef3d33; font-size: 18px; margin-right: 10px;
text-decoration: line-through;}
#product-modal .product-to-cart{float: left; min-width: 155px; font: 20px/75px "Oswald-Regular"}
#product-modal hr{background-color: #deba02; border: none; margin: 17px 0 25px 0; height: 1px}
#product-modal td{padding: 6px 50px 6px 0;}
#product-modal div.prev, #product-modal div.next{width:30px; height:80px; position:absolute; top:50%;
transform:translateY(-50%) ;margin:0; padding:0; cursor:pointer; z-index: 101}
#product-modal div.prev{left:-50px; background: url(/media/css/../images/svg/arrow-left.svg) no-repeat;
background-size: 100% 100%}
#product-modal div.next{right:-50px; background: url(/media/css/../images/svg/arrow-right.svg) no-repeat;
background-size: 100% 100%}

/* Product page */
div.section-header{margin: 0 0 15px 0; text-transform: uppercase;}
#product-images-section{width: 40%; margin: 15px 5% 20px 0; float: left;}
#product-images-section div.main-image{position: relative;}
#product-images-section div.main-image a{display: block; margin: 0 0 8px 0; max-height: 450px;}
#product-images-section div.main-image a img{display: block; max-width: 100%; margin: 0 auto}
#product-images-section div.mini-images{float: left; width: 100%;}
#product-images-section div.mini-images ul{float: left; width: 100%;}
#product-images-section div.mini-images li{float: left; margin: 0 5px 10px 0; width: calc((100% - 15px)/4)}
#product-images-section div.mini-images li:nth-child(4n){margin-right: 0;}
#product-images-section div.mini-images li a{width: 100%; float: left; display: block; border: 1px solid #e2e6e5;}
#product-images-section div.mini-images li a:hover{border-color: #00b6d5;}
#product-images-section div.mini-images li a img{display: block; width: 100%}

#product-navigation-section{width: 55%; float: left; margin: 15px 0 20px 0;}
#product-navigation-section div.price{font-family: "Oswald-Light"; margin: 0 0 20px 0;}
#product-navigation-section div.price span.current{font-size: 26px;}
#product-navigation-section div.price span.old{text-decoration: line-through; color: #fc474c; font-size: 16px; margin-right: 3px;}
#product-navigation-section div.price span.in-stock, #product-navigation-section div.price span.out-of-stock{
display: inline-block; width: 90px; height: 20px; position: relative; margin: 0 0 -1px 25px;}
#product-navigation-section div.price span.in-stock{background: url("/media/css/../images/stock-in.jpg") no-repeat;}
#product-navigation-section div.price span.out-of-stock{background: url("/media/css/../images/stock-out.jpg") no-repeat;}

#product-navigation-section div.quantity{margin-bottom: 20px; height: 35px; width: 98px}
#product-navigation-section div.quantity input.number{float: left; display: block; border-bottom: 1px solid #e2e6e7; 
border-top: 1px solid #e2e6e7; border-left: none; border-right: none; height: 100%; width: 30px; padding: 0 10px; text-align: center;}
#product-navigation-section div.quantity span.plus, #product-navigation-section div.quantity span.minus{display: block; 
float: left; height: 100%; cursor: pointer; border: 1px solid #e2e6e7;}
#product-navigation-section div.quantity span.plus{width: 22px; background: url("/media/css/../images/cart-plus.png") no-repeat center;}
#product-navigation-section div.quantity span.minus{width: 22px; background: url("/media/css/../images/cart-minus.png") no-repeat center;}

#product-navigation-section div.buttons{height: 50px; float: left; padding-bottom: 30px; border-bottom: 1px solid #e2e6e7; width: 315px;
margin-bottom: 20px;}
#product-navigation-section div.buttons > span{display: block; float: left; width: 49px; margin-left: 1px; height: 50px; cursor: pointer;}
#product-navigation-section div.buttons span.cart{background: #01b6d5 url("/media/css/../images/button-cart.svg") 20px center no-repeat; background-size: 25px 25px;
width: 165px; margin: 0; font: 18px/18px "Oswald-Light"; color: #fff; padding: 15px 0 0 60px; height: 50px; box-sizing: border-box}
#product-navigation-section div.buttons span.cart:hover{background-color: #0095b3;}
#product-navigation-section div.buttons span.cart.active{background: #2e3737; padding: 15px 0 0 30px;}
#product-navigation-section div.buttons span.cart.active span{color: #0095b3; width: 30px; display: inline-block;}
#product-navigation-section div.buttons span.quick-order{background: #2e3737 url("/media/css/../images/button-call.svg") no-repeat center;  background-size: 25px 25px}
#product-navigation-section div.buttons span.quick-order:hover{background: #2e3737 url("/media/css/../images/button-call-active.svg") no-repeat center;  background-size: 25px 25px;}
#product-navigation-section div.buttons span.compare{background: #2e3737 url("/media/css/../images/button-compare.svg") no-repeat center;  background-size: 25px 25px;}
#product-navigation-section div.buttons span.compare.active{background: #2e3737 url("/media/css/../images/button-compare-active.svg") no-repeat center;  background-size: 25px 25px;}
#product-navigation-section div.buttons span.favorites{background: #2e3737 url("/media/css/../images/button-like.svg") no-repeat center;  background-size: 25px 25px;}
#product-navigation-section div.buttons span.favorites.active{background: #2e3737 url("/media/css/../images/button-like-active.svg") no-repeat center;  background-size: 25px 25px;}

#product-navigation-section div.sku-fields{clear: both;}
#product-navigation-section div.sku-fields div.caption{text-transform: uppercase; margin: 0 0 5px 0;}
#product-navigation-section div.sku-fields div.options{margin: 0 0 22px 0; width: 100%; float: left;}
#product-navigation-section div.sku-fields div.options select{padding: 3px 10px; width: 150px;}
#product-navigation-section div.sku-fields div.options select option{padding: 1px 10px;}
#product-navigation-section div.sku-fields div.options ul.sku-params-list li{padding: 2px 7px; cursor: pointer; width: 150px;}
#product-navigation-section div.sku-fields div.options ul.sku-params-list li.selected{background: #ccc;}
#product-navigation-section div.sku-fields div.options ul.sku-params-list li:hover{background: #ccc;}
#product-navigation-section div.sku-fields div.options ul.sku-params-radio li{margin: 0 0 2px 0;}
#product-navigation-section div.sku-fields div.options ul.sku-params-images li{margin: 0 12px 10px 0; cursor: pointer; width: 65px;
display: inline-block}
#product-navigation-section div.sku-fields div.options ul.sku-params-images{float: left; width: 100%;}
#product-navigation-section div.sku-fields div.options ul.sku-params-images li img{display: block; border: 3px solid #fff;}
#product-navigation-section div.sku-fields div.options ul.sku-params-images li.selected img{border-color: #ccc;}
#product-navigation-section div.sku-fields div.options ul.sku-params-images li:hover img{border-color: #ccc;}
#product-navigation-section div.sku-fields div.options ul.sku-params-images li span{display: block; font-size: 12px;}

#product-params-section{width: 45%; float: left; box-sizing: border-box; padding: 20px 5% 20px 0; border-top: 1px solid #e2e6e7;}
#product-custom-fields{width: 100%;}
#product-custom-fields td{padding: 5px 10px;}
#product-custom-fields tr:nth-child(odd) td{background: #e2e6e7;}
#product-custom-fields td.name{padding-right: 20px;}
#product-description-section{width: 55%; float: left;  padding-top: 20px; border-top: 1px solid #e2e6e7;}

#product-previous-next{clear: both; border-bottom: 1px solid #e2e6e5; border-top: 1px solid #e2e6e5; padding: 27px 0 30px 0;}
#product-previous-next a.previous{padding: 0 0 0 18px; background: url(/media/css/../images/arrow-pager-left.png) left no-repeat;}
#product-previous-next a.next{float: right; background: url(/media/css/../images/arrow-pager-right.png) right no-repeat; padding: 0 18px 0 0;}

#recommended-header{font: 25px/25px "Oswald-Light"; padding: 25px 0 25px 0;}
#recommended-products{border-bottom: 1px solid #e2e6e5;  margin-bottom: 25px; padding-bottom: 25px;}
#recommended-products .product{margin-bottom: 30px;}

.hidden{display: none !important}
.show-dish{display: block !important}

/* End of file */


/* File data: media.css */

@media screen and (min-width: 1921px)
{
    #index-banner-slider{margin: 0 auto;}
}

@media screen and (max-width: 2000px)
{
    #index-banner-slider{margin: 0 auto;}
    .menu-scroll-left, .menu-scroll-right{display: block}
    .delivery-menu ul{overflow-x: auto; overflow-y: hidden; white-space: nowrap; -webkit-overflow-scrolling: touch;
     -ms-overflow-style: none; overflow: -moz-scrollbars-none; scrollbar-width: none;}
    .delivery-menu ul::-webkit-scrollbar {width: 0; height: 0}
    .delivery-menu .wrapper-1600{padding: 0 30px}
}

@media screen and (max-width: 1620px)
{
     #header{margin: 0 10px;}
     #header.high{height: 121px;}
     #logo{margin-right: 70px;}
     #catalog-products{justify-content: space-evenly;}
}

@media screen and (max-width: 1770px)
{
    .about .decoration-block.right .simpleParallax:nth-of-type(2){right: -100px}
    .about-restaurant .decoration-block.left .simpleParallax:first-of-type{left: 70px}
    .about-restaurant .decoration-block.right .simpleParallax:first-of-type{right: 50px}
}

@media screen and (max-width: 1500px)
{
    #header-top div.awards{display: none;}

    .about .decoration-block.left img{left: 5%}
    .about .decoration-block.right img{right: 5%}

    .about-restaurant .decoration-block.left .simpleParallax:first-of-type{left: -100px}
    .about-restaurant .decoration-block.right .simpleParallax:first-of-type{right: -150px}
    .black-background .decoration.left, .catalog .decoration.left{left: 10px; bottom: -35px}
    .black-background .decoration.right, .catalog .decoration.right{right: 10px}
    .jobs .black-background .decoration-block img{width: 80%; height: auto}
}

@media screen and (max-width: 1366px)
{
    .restaurants .decoration-block.left img{left: 5%}
    #top-menu > li{font-size: 16px;}
    #cart-summery{margin-top: -18px;}
    .social{padding-top: 8px}
}

@media screen and (max-width: 1350px)
{
    .restaurants-list .swiper-slide .address{font-size: 20px}
    .orders-history #client-menu-wrapper{width: 100%; position: static; padding-top: 10px;}
    .orders-history ul.client-menu li{display: inline-block; margin-right: 20px}
    .orders-history ul.client-menu{text-align: center}
    table.order-history{margin-top: 20px}
}

@media screen and (max-width: 1260px)
{
    .jobs .black-background .decoration-block{display: none}
    .restaurants .decoration-block.left img{display: none}
    
    #header-top{margin-bottom: 6px;}
    #logo{width: 120px; height: 120px;}
    #header-bottom{justify-content: flex-end;}
    #top-menu{display: none}
    .menu-button{display: flex; margin-right: auto;}
    .fixed-header .menu-button{display: flex;}

    div.modal-window{z-index: 120;}
    #product-modal{width: 80%;}
    #product-modal div.controls{padding: 30px 20px;}
    #product-modal .product-to-cart{min-width: 130px;}

    #menu-images-slider div.image-current{height: auto;}
}

@media screen and (max-width: 1140px)
{
    #search-form{margin: 0 2% 0 0;}
    div.carousel-controls{right: 1.5%}

    #cart-products div.description div.actions span{display: block; margin-bottom: 10px}
    .cart .decoration-block, .about .decoration-block{display: none}

    #footer .footer-logo img{display: block; width: 300px;}
}

@media screen and (max-width: 1035px)
{
    #header-top div.phone{display: none;}

    .restaurants-list{padding: 20px 0}
    .restaurants-list .wrapper-1600{padding: 0}
    .swiper-button-next, .swiper-button-prev{display: none !important}
    .slider-wrapper, .no-padding-mobile{padding: 0}
    .cart-additional-swiper .swiper-slide{width: 135px !important;}
    .restaurant-promo a{display: flex; flex-direction: column; align-items: center;}

    .about-restaurant{padding: 55px 0}
    .about-restaurant .decoration-block.left .simpleParallax:first-of-type{left: -200px}
    .about-restaurant .decoration-block.right .simpleParallax:first-of-type{right: -250px; bottom: 30px}
    .about-restaurant .decoration-block.left .simpleParallax:nth-of-type(2){bottom: 30px}
}

@media screen and (max-width: 980px)
{
    .restaurants .decoration-block.left, .about .decoration-block.right .simpleParallax:nth-of-type(2){display: none}

    #product-modal{height: auto;}
    #product-modal div.image{width: 50%;}
    #product-modal div.controls{width: 50%;}
    #product-modal td{padding-right: 12px;}
}

@media screen and (max-width: 930px)
{
    div.wrapper-aside{width: 100%}
    div.wrapper h1, #content h1, .editable h1{font-size: 30px; line-height: 36px; margin-bottom: 8px;}
    .delivery-title + p{text-align: left;}
    .editable{font-size: 14px; line-height: 20px;}
    .editable p{margin-bottom: 10px;}

    #content{float: none; width: 100%;}
    .about-restaurant .decoration-block{display: none}
    .about-restaurant{padding: 35px 0}
    div.top-block.category{margin-bottom: 15px;}

    #map{height: 70vh!important}
    div.swiper-slide .product{float: none; margin: 0 auto;}
    #client-menu-wrapper{width: 100%; position: static; padding-top: 10px}
    ul.client-menu li{display: inline-block; margin-right: 20px}
    ul.client-menu{text-align: center}
    .client-form, .change-password-form{padding-top: 20px}

    #footer .footer-logo img{margin: 0 auto 20px; display: block}
    #footer{padding-top: 50px; height: 655px}
    #sticky-footer-wrapper{padding-bottom: 655px}
}

@media screen and (max-width: 850px)
{
    #modal-address-check{width: 100%}
    img.certificate{float: none; margin: 0 auto 30px}
    .certificates .right-column{float: none; width: 100%}
}

@media screen and (max-width: 780px)
{
    #promo-conditions .wrapper-1200{padding: 0 10px 0 30px;}
    
    .promo-item{width: calc((100% - 20px)/2)}
    .promo-item:nth-child(n){margin-right: 20px}
    .promo-item:nth-child(2n){margin-right: 0}

    table.order-history th{font-size: 13px}
    table.order-history td{font-size: 15px}
    #gifts-line div.text{width: 0px;}
    #gifts-line div.scale{width: calc(100% - 70px)}
}

@media screen and (max-width: 760px)
{
    .black-background .decoration{display: none}
    .jobs .black-background .wrapper-1600{padding-bottom: 0}
    .bottom-text{padding: 30px 10px 0 30px;}

    #footer .footer-top .contacts{flex-direction: column; align-items: center; margin-bottom: 15px;}
    #footer .title, #footer .links a{font-size: 16px !important; line-height: 20px !important; text-align: center;}
    #footer .social{margin-bottom: 23px; justify-content: center;}
    #footer .payment-systems{text-align: center;}
    #footer .links{margin-top: 30px;}
    #footer .footer-logo img{margin: 0 auto 30px auto; display: block; max-width: 350px; width: auto;}
    #footer{padding-top: 30px; height: 730px}
    #sticky-footer-wrapper{padding-bottom: 730px}

    .footer-bottom{flex-direction: column; align-items: center; margin: 0 50px;}
    .footer-bottom p{font-size: 13px; line-height: 16px; color: #a0a0a0; margin-bottom: 12px; text-align: center;}
}

@media screen and (max-width: 700px)
{
    .catalog-item, .catalog-item.big{width: 100%; float: none; max-height: 100%}
    .catalog-item .image-wrapper, .catalog-item.big .image-wrapper{max-height: auto}
    .catalog-item.big .name{position: static}
    .black-background-wrapper .button{margin-top: 20px}

    #cart-products div.wrapper{padding-bottom: 7px}
    #cart-products div.image{width: 23%; padding: 20px 0 40px 0 !important; margin-right: 3%;}
    #cart-products div.description, #cart-products div.cost{float: right !important;
    width: 73%; text-align: left; padding: 12px 0 0 0!important;}
    #cart-products .quantity{margin-right: 10px; height: auto; float: none !important; position: absolute;
    bottom: 21%; right: 10%; padding: 0 !important; margin: 0 !important; width: 86px !important;}
    #cart-products div.quantity > div{width: 86px;}
    #cart-products div.quantity span.plus, #cart-products div.quantity span.minus{width: 24px; height: 24px;}
    #cart-products .quantity input.number{width: 38px !important;}
    #cart-products div.cost{color: #fba83c;}
    #cart-products .actions{position: absolute; top: 0; right: 0; padding: 14px 0!important; width: 20px; min-width: 20px}

    .cart-additional{padding-bottom: 0;}
    .gifts h2, .cart-additional h2{font: 18px/20px "Oswald-Regular"; margin-right: 10px; margin-left: 10px;}
    .gifts .wrapper{flex-flow: wrap column; align-items: center;}

    .radio-button:nth-child(n), .radio-buttons.payment .radio-button:nth-child(n), .client-address, .pickup-restaurant, .datetime-select,
    .payment-comment, #content .field-input.client-comment, #place-order-form .datetime-select .field-input
    {float: none; margin: 0 auto; width: 320px}
    .radio-button:nth-child(n){margin-bottom: 10px !important}
    .pickup-restaurant{font-size: 15px}
    #content div.gallery-images a.preview{width: 24%}
    
    .delivery-options .client-address, .delivery-options .pickup-restaurant, .delivery-options .client-comment
    {margin: 0 !important; width: auto !important;}
    .delivery-options .client-city.delivery{padding-left: 175px !important;}
    .delivery-options .client-address .field-name{width: 175px !important;}
    .delivery-options .client-address .field-input, .delivery-options .client-address .field-input.street
    {width: calc(100% - 175px) !important; padding: 0}
    div.radio-buttons{flex-direction: column;}
    div.radio-buttons.payment .radio-button{width: 100%; margin-bottom: 20px; height: auto; padding: 20px 10px 18px 50px;}

    #product-modal{height: 100%; max-height: auto; width: 100%; border-radius: 0; overflow-y: scroll;}
    #product-modal div.main{flex-direction: column; justify-content: center; height: 100%;}
    .modal-content{max-height: none;}
    #product-modal div.image{width: 100%; overflow: hidden; height: 370px; position: relative; display: flex;
    justify-content: center;}
    #product-modal div.image img{}
    #product-modal div.description{margin: 0 0 10px 0;}
    #product-modal div.controls{width: 100%; padding: 20px 10%;}
    #product-modal div.buttons{padding: 24px 15%;}
    #product-modal td{padding-right: 12px;}
    #product-modal div.prev{left: 0; background-image: url(/media/css/../images/svg/prev.svg); top: 185px}
    #product-modal div.next{right: 0; background-image: url(/media/css/../images/svg/next.svg); top: 185px}

    #place-order-form .final-sum{padding: 30px 10px;}
    #place-order-form .cart-total{width: 100%; margin-bottom: 0px; display: flex; flex-flow: wrap row;
    justify-content: space-between;}
    #place-order-form .big{margin-top: 0;}
    #place-order-form .cart-total .buttons{position: static; margin-bottom: 5px; width: 100%;}
    #place-order-form .cart-total .name, #place-order-form .cart-total .value{margin-bottom: 17px;}
    #place-order-form .cart-total .name{text-align: left; width: 78%;}
    #place-order-form .cart-total .value{text-align: right; width: 20%;}
    #place-order-form #place-order{width: 100%; max-width: 400px;}
    #place-order-form p.policy{font-size: 13px; line-height: 16px; margin-bottom: 0;}
}

@media screen and (max-width: 600px)
{
    div.fixed-menu{display: flex; justify-content: center;}
    .delivery-title{font-size: 30px}
    .black-background-wrapper{padding: 20px 0 30px}
    .black-background.delivery{padding-bottom: 20px;}

    #header-top a.cabinet, #header .social, #cart-summery, #restoplace-wrapper-btn, #scroll-up-button,
    div.fixed-header, #header-top div.right, #scroll-up-button, #footer .reserve-table{display: none !important;}
    #logo{width: 60px; height: 60px; margin-right: 60px;}
    #logo img.chili{height: 45px; right: -28px;}
    .menu-button{width: 45px;}
    .menu-button span, #header-top div.city-phones .title{display: none;}
    #header-bottom{position: absolute; top: 17px; right: 0;}
    #mobile-logo img.decoration{width: 24px; height: 40px; top: 2px; right: -18px}
    #header-top div.city-phones div.city > span{font-size: 16px;}
    .select-city div{background: url("/media/css/../images/svg/location-marker.svg") left 5px top 3px no-repeat;}

    #gifts-line{bottom: 50px; background: #fff; border: 1px solid #ef454f; height: 8px;}
    #gifts-line div.text{display: none;}
    #gifts-line div.scale{width: 100%; height: 8px;}
    #gifts-line div.scale > div.item{display: none;}
    #gifts-line div.cost{background: #ef454f; height: 6px !important;}

    #index-banner-slider div.banner-text{height: auto !important; width: 70% !important; bottom: 0}
    #index-banner-slider div.banner-text div.header{font-size: 30px; line-height: 30px}
    div.promo-banner .banner-text p.name{font: 20px "Oswald-Regular"; margin-bottom: 25px;}
    .restaurant-contacts .address{font: 25px "Oswald-Regular" !important;}
    #promo-conditions{padding: 20px 0;}
    #promo-details{position: relative; top: -18px;}
    .kr-next-arrow{right: 0 !important;}
    .kr-prev-arrow{left: 0 !important;}
    .loyalty-program .banner-text{padding: 150px 23%;}

    div.breadcrumbs{padding-top: 5px; margin-bottom: 5px;}
    .about img.title{max-width: 70%; margin-bottom: 25px;}
    .about img.title.mobile{display: block; width: 80%; margin: 0 auto 25px}
    .promo-item{width: 100%}
    .promo-item .text{height: auto;}
    .promo-item:nth-child(n){margin-right: 0}
    .restaurants .decoration-block.right{display: none}
    .restaurants.yellow-background p{background: none}
    .restaurants{padding: 0 0 30px 0}
    #product-params-section, #product-description-section{float: none; width: 100%; padding-right: 0}
    .delivery-zone{margin: 0 25px 20px;}
    
    form.regular{width: 100%}
    form.address-check div.form-buttons{float: none; margin: 15px auto 0; clear: both; top: 15px}
    form.address-check div.street{width: calc(100% - 1.5% - 110px);}
    form.address-check div.building{margin-right: 0}
    #modal-address-check .restaurant-select{width: 100%}

    div.top-block.cart h1, #content div.checkout h1{margin: 0 10px 8px 10px;}
    #cart-products{margin: 0 10px; padding: 5px 0 0 0;}
    #cart-products div.description span.name, #cart-products div.cost, #cart-products div.quantity input.number
    {font-size: 14px; line-height: 18px;}
    #cart-products div.cost{padding: 0 !important}
    #cart-products div.cost > span{margin-top: 3px !important;}
    #cart-products div.description .additional-ingredients span{font: 14px "Oswald-Regular"; color: #a0a0a0; margin-bottom: 5px;}
    .final-sum.cart{padding: 10px 0;}
    .final-sum.cart .cart-total{font-size: 24px;}

    .delivery-options h2{font: 18px/20px "Oswald-Regular";}
    div.cart-total div.name{width: 65%}
    div.cart-total div.value{width: 30%}
    div.order-complete table.order{width: 100%}
    div.order-complete table.order th{font-size: 14px;}
    #pay-online-button{font-size: 16px;}
    
    div.modal-window:not(#modal-city-choice){width: 100%; height: 100%; border-radius: 0;}
    div.modal-window .modal-content{width: 100%; padding: 40px 5% 20px 5%;}
    div.modal-window .close{top: 10px; right: 15px;}
    div.modal-window#banner-modal{height: auto; top: 0; left: 0; transform: none}
    div.modal-window div.form-errors, div.modal-window div.form-sent{max-width: none;}
    #modal-login .modal-content{padding: 40px 5%; width: auto;}
    #modal-login form, #modal-profile form{width: auto;}
    #modal-city-choice{width: 100%; top: 20%;}
    
    #menu-images-slider div.control{height: 70px; width: 30px; top: 40%; margin-top: -20px;}
    #menu-images-slider div.control.next{right: 0px;}
    #menu-images-slider div.control.prev{left: 0px;}

    .menu-scroll-left, .menu-scroll-right{display: none;}
    #catalog-products{justify-content: space-between;}
    #catalog-products .product{width: calc((100% - 6px) / 2); margin-bottom: 15px;}
    .product div.image{margin-bottom: 10px; border-radius: 15px; background: #ddd; height: auto;}
    .product div.image img{top: auto; bottom: auto;}
    .product div.image img:last-child{display: none;}
    .product div.image img:first-child{display: block; max-width: 100%;}
    .product .product-info{height: 120px;}
    .product div.name, .product div.price span.price, .product div.buttons span.cart, .quantity span.number{font-size: 14px;
    line-height: 18px;}
    .product .weight, .product .description{font-size: 13px; line-height: 16px;}
    .product .description{height: 50px; overflow: hidden;}
    .product .bottom{height: 24px;}
    .product div.buttons{width: 80px;}
    .product div.buttons span.cart{width: 80px; height: 40px; padding: 0; display: flex; justify-content: center;
    align-items: center; min-width: auto;}
    .product .quantity{width: 76px; margin-right: 10px; height: 24px;}
    .product div.quantity span.plus, div.product div.quantity span.minus{width: 24px !important; 
    height: 24px !important;}
    .product .quantity span.number{width: 28px;}
    .product select{height: 30px; padding: 0 20px 0 12px; background-position: right 7px center;
    background-size: 12px 12px; margin-bottom: 0; font-size: 13px;}

    h1{text-align: left !important;}
    .black-background h1, .restaurant-promo h1{text-align: center !important; margin-bottom: 15px !important}
    h1 a.back{display: inline-block;}
}

@media screen and (max-width: 530px)
{
    .about{padding: 30px 0}
    .about .button{margin-top: 20px;}
    #mobile-top-menu, #mobile-user-menu{width: 100%}

    #product-images-section div.mini-images li{width: 19%}
    div.new-products-header{margin-bottom: 55px}
    div.carousel-controls{top: -40px}
    /* .restaurant-contacts{padding: 120px 95px!important} */
    .kr-cloud p, .restaurant-contacts p{font-size: 15px !important}
    
    form.regular div.field-name, form.regular div.field-input{width: 100%}
    form.regular input[type="text"], form.regular input[type="password"], form.regular input[type="email"],
    form.regular select{margin-bottom: 10px}
    form.regular div.field-name, .registration-form div.field-name{height: auto; line-height: 1.5; margin-bottom: 3px}
    form.regular .client-address div.field-name{height: 50px;}
    form.regular div.buttons input:not([type="checkbox"]){font-size: 16px; line-height: 20px;}
    .registration-form form input[name="phone"]{width: calc(100% - 135px) !important;}
    #place-order-form input[name="secret_code"]{width: calc(100% - 135px) !important;}

    .delivery-options .client-city.delivery{padding-left: 0 !important;}
    div.checkout .client-address .field-input, .delivery-options .client-address .field-input.street
    {padding: 0; width: 100% !important;}
    div.checkout div.field-name, div.checkout div.field-input{width: 100% !important; float: none !important;
    height: auto !important;}
    div.checkout .radio-buttons.delivery{padding:  40px 0 30px 0; background: #fdf1e3;}

    div.order-complete table.order th{font-size: 13px}
    div.modal-window form{width: 100%!important}
    #modal-profile .phone, #modal-profile .age{width: 100%; margin-right: 0}

    form.address-check div.street, form.address-check div.building{width: 100%; float: none; margin-right: 0}
    form.address-check div.street{margin-bottom: 20px}

    ul.client-menu{display: flex; flex-flow: wrap row; justify-content: center;}
    ul.client-menu li{margin: 0 !important; width: 50%;}

    .decoration, .decoration-block{display: none !important;}
}

@media screen and (max-width: 500px)
{
    #product-modal div.image img{left: 0;}
    #cookies-options{bottom: 35px; left: auto; width: 100%;}
}

@media screen and (max-width: 450px)
{
    .gifts .gift{padding: 12px 10px 15px 45px; background-position: left 10px center;
    text-align: left;}
    .gifts .gift > *{display: inline;}
    .gifts .gift > span{margin-left: 5px;}
    .gifts .gift span span{display: none;}
    form.promo-code input[type="button"]{font-size: 16px;}
    div.order-complete table.order th, div.order-complete table.order td{
    padding-left: 5px; padding-right: 5px;}

    .product .product-info{height: 150px;}    
    .product .description{height: 66px;}

    div.order-complete-email{padding: 15px}
    div.order-complete-email form{width: auto; justify-content: space-between}
    div.order-complete-email form input{width: calc(100% - 100px)}

    #phone-verification-section ul.verification-type li{padding: 0 12px 10px 12px}
    #phone-verification-section ul.verification-type li:first-child{margin-right: 10px}
    #phone-verification-section div.field-wrapper div.field-name{margin-bottom: 5px}

    #place-order-form .radio-button{width: 100%}
}

@media screen and (max-width: 400px)
{
    .social .icon{margin-right: 7px;}
    .menu-button{margin-left: 7px;}

    #cookies-options div.buttons{justify-content: space-between;}
    #cookies-options div.buttons span{height: auto; text-align: center; line-height: 16px;
    padding: 4px 12px 5px 12px; margin: 0; width: 48%}
}

/* End of file */

