@font-face {font-family: "Gist"; src: url("/fonts/Gist_Uprigh_Extrabold.eot"); src: url("/fonts/Gist_Uprigh_Extrabold.eot?#iefix") format("embedded-opentype"), url("/fonts/Gist_Uprigh_Extrabold.woff2") format("woff2"), url("/fonts/Gist_Uprigh_Extrabold.woff") format("woff"), url("/fonts/Gist_Uprigh_Extrabold.ttf") format("truetype"), url("/fonts/Gist_Uprigh_Extrabold.svg#Gist") format("svg"); }

@font-face {font-family: "Qlassik"; src: url("/fonts/QlassikTB.eot"); src: url("/fonts/QlassikTB.eot?#iefix") format("embedded-opentype"), url("/fonts/QlassikTB.woff2") format("woff2"), url("/fonts/QlassikTB.woff") format("woff"), url("/fonts/QlassikTB.ttf") format("truetype"), url("/fonts/QlassikTB.svg#Qlassik") format("svg"); }

@font-face {font-family: "QlassikBold"; src: url("/fonts/QlassikBoldTB.eot"); src: url("/fonts/QlassikBoldTB.eot?#iefix") format("embedded-opentype"), url("/fonts/QlassikBoldTB.woff2") format("woff2"), url("/fonts/QlassikBoldTB.woff") format("woff"), url("/fonts/QlassikBoldTB.ttf") format("truetype"), url("/fonts/QlassikBoldTB.svg#QlassikBold") format("svg"); }

@font-face {font-family: "gycentiumpopwell"; src: url("/fonts/gycentiumpopwell.eot"); src: url("/fonts/gycentiumpopwell.eot?#iefix") format("embedded-opentype"), url("/fonts/gycentiumpopwell.woff2") format("woff2"), url("/fonts/gycentiumpopwell.woff") format("woff"), url("/fonts/gycentiumpopwell.ttf") format("truetype"), url("/fonts/gycentiumpopwell.svg#gycentiumpopwell") format("svg"); }

* { -moz-box-sizing:border-box; margin:0; padding:0; }
html, body { -webkit-overflow-scrolling:touch; }

body { width:100%; font-weight:normal; line-height:normal; overflow-x:hidden; margin:0; padding:0; font-family: 'Oswald', sans-serif; color: #fff; background: #4b382f; }

.global { display:flex; flex-direction:column; min-height:100%; }

main { flex: 1 0 auto; }
footer {flex: 0 0 auto; }

a { cursor:pointer; color:#fff; outline:none; text-decoration: underline; font-family: 'Oswald', sans-serif; opacity: 0.9; }
a:hover { color:#fff; text-decoration: none; opacity: 1; }

a , a:hover , .ease2 { -webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-ms-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;}

ol li , ul li { margin-left: 30px; padding-left: 10px; padding-bottom: 7px; }

.unSize { font-size:0; letter-spacing: 0; }
.unMargin { margin:0 -10px; }

input , textarea { border: none; padding: 0; margin: 0; outline: none; display: inline-block; font-family: 'Oswald', sans-serif; color:#4c382f; font-size: 16px; text-transform:none !important; border:solid 1px rgba(0,0,0,0.2); }

.radius { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

#GoUp { position:fixed; width:30px; height:30px; }

h1 , h2 , h3 , h4 { margin: 0; padding: 0; font-weight: 600; font-family: 'Oswald', serif; }

#shadow { position: fixed; left: 50%; top:50%; background: none; overflow: hidden; width: 0; height: 0; }

.max-width { position: relative; display: block; margin: 0 auto; max-width: 980px; overflow: hidden; }

header { text-align: center; padding: 30px 0 0; }

.logotype { width: auto; max-width:40%; height: auto; min-width: 200px; }

.menu-title { font-size: 50px; color: #fff; }

.menu { padding: 25px 20px; text-align: left; color: #4c382f; font-size: 16px; }

.menu-back { position: relative; margin-bottom: 30px; background: #fff; }

.menu-back .radius-top { position: absolute; width: 100%; top: 0; }
.menu-back .radius-bottom { position: absolute; width: 100%; bottom: 0; }

.menu-back .radius-top:after , .menu-back .radius-bottom:after , .menu-back .radius-top:before , .menu-back .radius-bottom:before { content: ""; position: absolute; width: 90px; height: 90px; background: #4b382f; border-radius: 50%; -webkit-border-radius: 50%; -mos-border-radius: 50%; }
.menu-back .radius-top:after { left: -45px; top: -45px; }
.menu-back .radius-top:before { right: -45px; top: -45px; }
.menu-back .radius-bottom:after { left: -45px; bottom: -45px; }
.menu-back .radius-bottom:before { right: -45px; bottom: -45px; }

.padding { padding: 60px 60px 20px 60px; }

.step-title { position: relative; font-size: 50px; margin-bottom: 40px; text-align: center; font-family:"Gist"; color: #4c382f; }

.step-title span { background: #fff; padding: 0 70px; position: relative; z-index: 2; }

.step-title:before { content: ''; position: absolute; width:100%; left: 0; right: 0; height:5px; background:#4c382f; top: 50%; margin-top: -2px; }
.step-title span:before , .step-title span:after { content: ''; position: absolute; width:34px; height:34px; background: url(/images/star.png) center no-repeat; top: 50%; margin-top: -17px; }
.step-title span:after { margin-left:25px; }
.step-title span:before { margin-left:-55px; }

.step-title input { width: 80%; font-size: 50px; text-align: center; font-family:"Gist"; color: #4c382f; position: relative; z-index: 2; background: #fff; }

.step-list { padding-bottom: 20px; }

.type-title , .info-title , .auth-title { font-size: 30px; line-height: 40px; padding-bottom: 10px; color: #4b382f; font-family:"Gist"; }

.auth-title { font-size: 20px; }

.type-title input { width: 80%; font-size: 30px; color: #c44b44; }

.dish-list { border-bottom: solid 7px #4b382f; padding: 0 20px 10px; margin: 0 -20px 15px; }

.step-list .dish-list:last-child { border-bottom: 0; }

.dish-item { position: relative; padding-bottom: 30px; }

.dish-item-name { font-size: 40px; line-height: 45px; margin-right: 70px; font-family:"Gist"; margin-bottom: 5px; }

.is_list .dish-item-name , .is_list .dish-item-text , .edit .dish-item-name , .edit .dish-item-text { padding-left: 30px; }

.dish-item-name input , .dish-item-text textarea { width: 90%; font-size: 24px; line-height: 29px; margin-right: 70px; }

.dish-item-name strong { position: absolute; margin-left: -30px; color: #c44b44; font-size: 24px; }

.dish-item-name strong input { width: 30px; text-align: center; color: #c44b44; font-size: 24px; font-weight: 600; display: inline-block; vertical-align: middle; margin-bottom: -2px; }

.dish-item-price { position: absolute; right: 0; font-size: 30px; font-weight: 600; line-height: 40px; color: #4c382f; font-family: 'QlassikBold', serif; }

.dish-item-price input { width: 60px; text-align: center; color: #c44b44; font-size: 22px; font-weight: 600; }

.dish-item-text { font-size: 24px; margin-right: 70px; margin-bottom: 5px; letter-spacing: 1px; font-family: 'QlassikBold', serif; }

.dish-item-text span { position: absolute; font-size:20px; left: 0; line-height: 40px; text-align: center; width: 26px; }

.dish-item-text textarea { font-size: 24px; line-height: 24px; font-family: 'QlassikBold', serif; }

.dish-item-text.type2 , .dish-item-text.type2 textarea { font-family: 'gycentiumpopwell', serif; font-size: 27px; }

.delete-me { position: absolute; width: 25px; height: 25px; right: 0; text-align: center; line-height: 20px; font-size: 20px; font-weight: 600; color: #fff; border: solid 1px #fff; border-radius: 6px; cursor: pointer; margin:0 10px 0 0; background: url(/images/close.png) center no-repeat; background-color: #4c382f; }
.delete-me:hover { background-color: #c00; }

.ajaxAdd.active { display: block; }
.shadow { position: fixed; left: 0; top: 0; z-index: 2; background: rgba(0,0,0,.4); width: 100%; height: 100%; opacity: 0; }
.active .shadow { opacity:1; }
.info , .auth-block { width: 300px; background: #fff; height: 300px; position: absolute; left: 50%; top: 50%; margin: -150px 0 0 -150px; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.4); color: #4c382f; text-align: center; }
.info .padding , .auth-block .psdding { padding: 20px; }
.info-text { font-size: 17px; line-height: 21px; padding: 5px 0 10px; }
.info-text strong { display: block; }

.btn { display: block; margin: 10px auto 0; width: 120px; padding: 5px 7px 7px; background: rgba(202,68,54,0.7); color: #FFF; border-radius: 5px; box-shadow: 1px 1px 2px rgba(0,0,0,0.4); cursor: pointer; font-size: 13px; text-align: center; }
.cencel , .add , .auth-me { background: rgba(111,164,140,0.7); }
.cencel span { position: absolute; right: 0; top: 0; width: 25px; height: 25px; text-align: center; color: #fff; border-radius: 0 5px 0 7px; background: url(/images/close.png) center no-repeat; background-color: rgba(51,51,51,0.7); }
.confirm:hover { background: rgba(202,68,54,1); }
.cencel:hover , .add:hover { background: rgba(111,164,140,1); }
.cencel:hover span {  background-color: rgba(51,51,51,1); }

.auth-block { position: fixed; }
.auth-block .padding { padding: 30px; }
.auth-block .input { padding:0 0 10px; }
.auth-block input { background: #4c382f; border: solid 1px #fff; box-shadow: 0 0 2px rgba(0,0,0,0.2); font-size: 14px; color: #fff; padding: 5px 10px; }
.auth-block strong { display: block; padding-bottom: 5px; }

.menu svg { width: 25px; height: 25px; cursor: pointer; }

.menu .dish-item-price svg { width: 14px; height: 19px; display: inline-block; vertical-align: baseline; }

.menu .dish-item-price svg path { fill:#4c382f; }

.menu svg path { fill: #ccc; }

.menu svg.checked path { fill:#4c382f; }

.menu-title { position: relative; text-align: center; padding: 25px 0 0; margin: 0 20px; }

.menu-title span:after , .menu-title span:before { content: ""; display: inline-block; vertical-align: middle; width:38px; height:6px; background: url(/images/menu_line.png) 50% 50% no-repeat; margin: 0 5px; }
.menu-title span:after { left:0; }
.menu-title span:before { right:0; }

.side-left , .side-right , .side-center { display: inline-block; text-align: center; vertical-align: bottom; width: 32%; white-space: nowrap; }
.side-left { width: 28%; position: absolute; left:0; }
.side-center { width: 30%; }
.side-right { width: 35%; position: absolute; right:0; }

.menu-title span { display: block; cursor: pointer; position: relative; opacity: 0.8; font-family:"Gist"; }
.menu-title span.active { opacity: 1; }

footer { padding: 0 30px 25px; text-align: center; }

.foot { margin: 0; position: relative; }

.webs { position: absolute; top: 0; }
.webs.pos-left { left: 0; }
.webs.pos-right { right: 0; }
.webs svg { width: 35px; height: 35px; }

footer address , footer .phone , footer .mail { display: inline-block; width: 25%; color: #fff; font-size: 18px; font-style:normal; vertical-align: middle; }
footer address { width: 35%; }
footer a { color: #fff; font-size: 18px; }

@media (max-width: 990px) {
	.max-width { padding: 0 10px; }
	
	footer { padding: 0 20px 25px; }
}

@media (max-width: 980px) {
	.max-width { padding: 0 20px; }
}

@media (max-width: 768px) {
	
	.menu-title { font-size: 44px; }
	
	.type-title , .type-title input { font-size: 30px; line-height:37px; }
	
	.dish-item-name , .dish-item-name input , .dish-item-price { font-size: 26px; line-height:32px; }
	
	.dish-item-price , .dish-item-price input { line-height:26px; }
	
	footer address , footer .phone , footer .mail { font-size: 16px; }
	
	.dish-item-text, .dish-item-text textarea { font-size: 18px; }
	.dish-item-text.type2, .dish-item-text.type2 textarea { font-size: 20px; }
	
	.step-title { font-size: 25px; }
	
	.dish-item-name strong input { margin-bottom: 2px; }
	
	.step-title span:before, .step-title span:after { margin-top: -7px; width: 17px; height: 17px; background-size: cover; }
	.step-title span:before { margin-left: -41px; }
}

@media (max-width: 680px) {
	.max-width { padding: 0 10px; }
	.padding { padding: 30px; }
	
	footer address , footer .phone , footer .mail { display: block; margin: 0 auto; width: auto; padding: 5px 0; }
	
	.menu-title { font-size:33px; }
	
	.step-title { font-size: 22px; }
}
@media (max-width: 680px) {
	.menu-title {
		 font-size: 24px;
	}
	
	.menu-back .radius-top:after, .menu-back .radius-bottom:after, .menu-back .radius-top:before, .menu-back .radius-bottom:before { width:60px; height: 60px; }
	.menu-back .radius-top:before {
		 right: -30px;
		 top: -30px;
	}
	.menu-back .radius-top:after {
		 left: -30px;
		 top: -30px;
	}
	.menu-back .radius-bottom:before {
		 right: -30px;
		 bottom: -30px;
	}
	.menu-back .radius-bottom:after {
		 left: -30px;
		 bottom: -30px;
	}
	.menu-title span:after, .menu-title span:before { width:26px;}
}

@media (max-width: 480px) {
	.menu { padding:20px 10px; }
	.max-width { padding: 0 10px; }
	.padding { padding: 20px; }
	
	.menu-back .radius-top:after, .menu-back .radius-bottom:after, .menu-back .radius-top:before, .menu-back .radius-bottom:before { width: 66px; height: 66px; }
	
	.dish-item-name , .dish-item-name input , .dish-item-price { font-size: 23px; line-height:32px; }
	.dish-item-text { margin-right: 0; }

	.webs svg { width: 45px; height: 45px; }
	
	.menu-title { font-size: 20px; }
	
	.menu-title .side-center span:after , .menu-title .side-center span:before { width: 26px; }
	
	.menu-title .side-center span:after { left:-20px; }
	.menu-title .side-center span:before { right: -20px; }
	
	.menu-back .radius-top:after, .menu-back .radius-bottom:after, .menu-back .radius-top:before, .menu-back .radius-bottom:before { width:40px; height: 40px; }
	.menu-back .radius-top:before {
		 right: -20px;
		 top: -20px;
	}
	.menu-back .radius-top:after {
		 left: -20px;
		 top: -20px;
	}
	.menu-back .radius-bottom:before {
		 right: -20px;
		 bottom: -20px;
	}
	.menu-back .radius-bottom:after {
		 left: -20px;
		 bottom: -20px;
	}
}

@media (max-width: 479px) {
	.step-title:before { display: none; }
	.menu-title span:after , .menu-title span:before { display: none; }
	.step-title span { padding:0; }
	
	.dish-item-name , .dish-item-name input , .dish-item-price { font-size: 20px; line-height:32px; }	
	
	.webs.pos-left { left: -15px; }
	.webs.pos-right { right: -15px; }
	.webs svg { width: 35px; height: 35px; }
	
	.menu-title span:after, .menu-title span:before { width: 16px; }
}
	
	
	