@font-face	{font-family:'XendroCaps';src:url('../fonts/xendrocaps.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap;unicode-range:U+10D0-10F0,U+20BE;}
@font-face	{font-family:'Xendro';src:url('../fonts/xendro.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap;unicode-range:U+10D0-10F0,U+20BE;}
:root {
	font-size: 14px;
	--theme-color: #f00;
	--crown-color: #093;
	--logo-light-color: #444;
	--inv-logo-light-color: #aaa;
	--logo-dark-color: #000;
	--inv-logo-dark-color: #ccc;
	--bg-color: #fff;
	--inv-bg-color: #222;
	--txt-color: #222;
	--inv-txt-color: #fff;
	--button-color: #363636;
	--disabled-button-color: #9a9a9a;
	--label-color: #7f7f7f;
	--inv-label-color: #aaa;
	--disabled-label-color: #777;
	--border-color: #7f7f7f;
	--inv-border-color: #c3c3c3;
	--flag-border-color: rgba(255,255,255,.2);
	--flag-hover-border-color: rgba(255,255,255,.4);
	--dark-transp-color: rgba(195,195,195,0);
	--overlay-color: rgba(0,0,0,.5);
	--error-color: rgba(255,0,0,.2);
	--disabled-bg-color: #ededed;
	--horizontal-line: linear-gradient(to left, var(--dark-transp-color) 0%, var(--border-color) 30px, var(--border-color) calc(100% - 30px), var(--dark-transp-color) 100%);
}
*, *::before, *::after {
	box-sizing: border-box;
	outline: none;
	font-family: Xendro, Verdana, Arial, Sans-serif;
}
.GEL::after {
	content: '\00a0\20BE';/*'&nbsp;₾';*/
	font-family: Xendro;
	font-size: 1.1em;
}
.USD::after {
	content: '\00a0\0024';/*'&nbsp;$';*/
	font-family: Verdana, Arial, Sans-serif;
}
.EUR::after {
	content: '\00a0\20AC';/*'&nbsp;€';*/
	font-family: Verdana, Arial, Sans-serif;
}
body {
	overflow-y: scroll;
	background-color: var(--bg-color);
	color: var(--label-color);
	/*font-family: Xendro, Verdana, Arial, Sans-serif;*/
	font-size: .9rem;
	margin: 0;
	padding-top: 90px;
}
body.noScroll {
	position: relative;
	overflow: hidden;
	height: 100%;
}
/* text input */
input[type='text'], input[type='password'], textarea {
	background: transparent;
	height: 38px;
	border: 1px solid var(--border-color);
	border-radius: 5px;
	font: normal 1rem Xendro, Verdana, Arial, Sans-serif;
}
header.scroll input[type='text'], header.scroll input[type='password'] {
	border-color: var(--inv-border-color);
	color: var(--inv-txt-color);
}
input[type=text]:focus, input[type=password]:focus, textarea:focus, header.scroll input[type=text]:focus, header.scroll input[type=password]:focus {
	border-color: var(--theme-color);
}
input[type=text]:disabled, input[type=password]:disabled, textarea:disabled {
	border-color: var(--disabled-button-color);
	background-color: var(--disabled-bg-color);
}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
	box-shadow: 0 0 0 30px var(--bg-color) inset !important;
	-webkit-text-fill-color: var(--label-color) !important;
}
input[type=text].error, input[type=password].error, textarea.error {
	background-color: var(--error-color);
	border-color: var(--theme-color);
}
/* text input end */
/* animated label */
input[type='text'] + label, input[type='password'] + label {
	font: bold 1rem/1.1rem XendroCaps, Verdana, Arial, Sans-serif;
	padding: 0 2px;
	position: absolute;
	top: calc(50% - .5rem);
	left: 5px;
	color: var(--label-color);
	cursor: text;
	transition: all 300ms ease;
}
header.scroll input[type='text'] + label, header.scroll input[type='password'] + label {
	color: var(--inv-label-color);
}
input:focus + label, input:not(:placeholder-shown) + label {
	top: -5px;
	left: 5px;
	font-size: .8rem;
	color: var(--txt-color);
	background-color: var(--bg-color);
	cursor: default;
}
header.scroll input:focus + label, header.scroll input:not(:placeholder-shown) + label {
	color: var(--inv-txt-color);
	background-color: var(--button-color);
}
/* animated label end */
/* button */
button, input[type='button'] {
	height: 38px;
	border: none;
	border-radius: 5px;
	background-color: var(--button-color);
	color: var(--inv-txt-color);
	font: bold 1rem/38px XendroCaps, Verdana, Arial, Sans-serif;
	padding: 0 15px;
}
button:hover, input[type='button']:hover {
	background-color: var(--theme-color);
}
header.scroll button, header.scroll input[type='button'] {
	background-color: var(--bg-color);
	color: var(--txt-color);
}
header.scroll button:hover, header.scroll input[type='button']:hover {
	background-color: var(--theme-color);
	color: var(--inv-txt-color);
}
/* button end */
/* icons */
.icon {
	display: inline-block;
	vertical-align: top;
	width: 32px;
	height: 32px;
}
.iconSmall {
	display: inline-block;
	vertical-align: top;
	width: 20px;
	height: 20px;
}
button>.iconSmall {
	fill: currentColor;
}
button>svg.iconSmall:first-child {
	margin: 8px 8px 0 0;
}
button>svg.iconSmall:last-child {
	margin: 8px 0 0 8px;
}
/* icons end */
/* rest */
a:link, a:visited {
	color: var(--theme-color);
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}
a:hover, a:active {
	color: var(--theme-color);
}
#svgcontainer {
	display: none;
}
header {
	position: fixed;
	z-index: 2;
	top: 0;
	width: 100%;
	padding: 10px;
	background-color: var(--bg-color);
	transition: all 500ms;
}
header.scroll {
	padding: 5px 5px 5px 10px;
	background-color: var(--inv-bg-color);
	box-shadow: 0 0 5px var(--inv-bg-color), 0 0 10px var(--inv-bg-color);
}
#logo, a:has(#logo) {
	height: 56px;
	float: left;
	transition: all 500ms;
}
#logoLight {
	fill: var(--logo-light-color);
}
#logoDark {
	fill: var(--logo-dark-color);
}
header.scroll #logo, header.scroll a:has(#logo) {
	height: 38px;
}
header.scroll a:has(#logo) {
	margin-top: 0;
}
header.scroll #logoLight {
	fill: var(--inv-logo-light-color);
}
header.scroll #logoDark {
	fill: var(--inv-logo-dark-color);
}
.menuSeparator {
	position: relative;
	margin: 10px 0;
	height: 2px;
	width: 100%;
	background: var(--horizontal-line);
}
/* nav */
a.menuItem, a.menuItem:visited {
	display: block;
	white-space: nowrap;
	font: bold .9rem XendroCaps, Verdana, Arial, Sans-serif;
	color: var(--button-color);
	margin-bottom: 20px;
}
header.scroll a.menuItem, header.scroll a.menuItem:visited {
	color: var(--inv-txt-color);
}
a.menuItem:active, a.menuItem:hover,header.scroll a.menuItem:active, header.scroll a.menuItem:hover {
	color: var(--theme-color);
}
.menuItem .icon {
	vertical-align: bottom;
	margin: 0;
	fill: currentColor;
}
/* nav end */
/* languages */
#flags {
	display: block;
	white-space: nowrap;
	text-align: center;
    border-radius: 5px;
	background-color: var(--inv-logo-light-color);
	margin: 0 -20px;
	overflow: hidden;
}
header.scroll #flags {
	background-color: var(--button-color);
}
a.lang, a.lang:visited {
	display: inline-block;
	color: var(--inv-txt-color);
	text-decoration: none;
	margin: 9px 5px 9px 0;
}
a.lang:hover, a.lang:active {
	color: var(--theme-color);
}
a.lang:last-child {
	margin-right: 0;
}
.flag {
	vertical-align: bottom;
	height: 20px;
	width: 29px;
	border: 1px solid var(--flag-border-color);
}
a.lang:hover .flag {
	border-color: var(--flag-hover-border-color);
	outline: 1px solid var(--flag-hover-border-color);
}
a.lang .hidden {
	margin-left: 5px;
	font: bold .8rem XendroCaps, Verdana, Arial, Sans-serif;
	text-transform: uppercase;
}
a.menuItem .hidden {
	font: bold .9rem XendroCaps, Verdana, Arial, Sans-serif;
}
/* languages end */
#overlay {
	display: none;
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1;
	background: var(--overlay-color);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}
#overlay.open {
	display: block;
}
#mainMenu {
	position: absolute;
	top: 48px;
	right: -320px;
	width: 320px;
	height: calc(100vh - 48px);
	overflow-y: auto;
	padding: 10px 20px;
	background-color: var(--button-color);
	transition: right .5s;
}
#mainMenu.open {
	right: 0;
}
#loginFormHeader {
	margin-bottom: 5px;;
	font: bold .9rem XendroCaps, Verdana, Arial, Sans-serif;
	color: var(--inv-txt-color);
}
#loginFormHeader>svg {
	vertical-align: middle;
	fill: var(--inv-txt-color);
}
#LogInFormOpener {
	display: none;
}
#loginForm>div {
	display: block;
	position: relative;
	margin-bottom: 10px;;
}
#loginForm input[type='text'], #loginForm input[type='password'] {
	width: 100%;
}
#logIn {
	padding: 0;
	height: 32px;
	position: absolute;
	right: 3px;
	top: 3px;
}
#logIn>svg {
	margin: 6px 6px 0 0;
}
#cart {
	float: right;
	margin: 22px 15px 0 0;
	color: var(--txt-color);
	transition: margin 300ms;
}
#cart:hover, #cart:active, header.scroll #cart:hover, header.scroll #cart:active {
	color: var(--theme-color);
}
header.scroll #cart {
	float: right;
	margin: 2px 15px 0 0;
	color: var(--inv-txt-color);
}
#cart svg {
	fill: currentColor;
}
a:has(.count) {
	position: relative;
}
.count {
	display: inline-block;
	position: absolute;
	top: -5px;
	left: 25px;
	background-color: var(--theme-color);
	color: var(--inv-txt-color);
	border-radius: 8px;
	font-size: 10px;
	line-height: 6px;
	padding: 5px;
}
.count:empty {
	display: none;
}
/* hamburger menu */
#mainMenuIcon {
	width: 64px;
	height: 64px;
	float: right;
	margin: 7px -16px -16px -16px;
	transition: margin 300ms, transform 400ms;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	user-select: none;
}
#mainMenuIcon.open {
	transform: rotate(45deg);
}
.line {
	fill: none;
	transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
	stroke: var(--txt-color);
	stroke-width: 7.5;
	stroke-linecap: round;
}
#mainMenuIcon.open .line, #mainMenuIcon:hover .line {
	stroke: var(--theme-color);
}
header.scroll .line {
	stroke: var(--inv-txt-color);
}
#mainMenuIcon .top, #mainMenuIcon .bottom {
	stroke-dasharray: 40 121;
}
#mainMenuIcon.open .top, #mainMenuIcon.open .bottom {
	stroke-dashoffset: -68px;
}
header.scroll #mainMenuIcon {
	margin: -13px -16px -16px -16px;
}
/* hamburger menu end */
/* main */
main {
	min-height: calc(100vh - 188px);
	margin: 0 5px;
}
/* main end */
/* home */
.prodRow {
	min-height: 112px;
	padding: 5px 5px 0 105px;
	border: 1px solid var(--border-color);
	margin-bottom: 10px;
	border-radius: 5px;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
.prodName {
	font: bold .9rem XendroCaps, Verdana, Arial, Sans-serif;
	padding: 3px 0;
	background-color: var(--crown-color);
	color: var(--inv-txt-color);
	border-radius: 0 4px 4px 0;
}
.prodImage {
	float: left;
	width: 100px;
	height: 100px;
	margin-left: -100px;
	margin-right: 5px;
	border: 3px solid var(--crown-color);
	border-radius: 10px 0 10px 10px;
	background-size: cover;
	background-position: center;
}
.prodDescription {
	display: none;
}
.prodOptions {
	padding: 5px 0 5px 5px;
}
div.priceOption {
	/*width: 200px;*/
	padding: 3px 8px;
	margin-bottom: 3px;
	background-color: var(--button-color);
	color: var(--inv-txt-color);
	border-radius: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
div.priceOption:last-child {
	margin-bottom: 0;
}
/*.prodOptions label:has(input.hidden) {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 200px;
}
.prodOptions label:has(input.hidden):last-child {
	margin-bottom: 0;
}
input[type='radio'].hidden, input[type='checkbox'].hidden {
	display: none;
}
label:has(input[type='radio'].hidden), label:has(input[type='checkbox'].hidden) {
	cursor: pointer;
	display: block;
	padding: 3px 8px;
	margin-bottom: 3px;
	background-color: var(--button-color);
	color: var(--inv-txt-color);
	border-radius: 4px;
}
label:has(input[type='radio'].hidden):hover, label:has(input[type='radio'].hidden:checked), label:has(input[type='checkbox'].hidden):hover, label:has(input[type='checkbox'].hidden:checked) {
	background-color: var(--crown-color);
}*/
/* order window */
#orderWindow {
	width: 320px;
	height: 400px;
	background-color: var(--bg-color);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	box-shadow: 5px 5px 10px var(--overlay-color);
}
#orderWindowHeader {
	margin: -1px -1px 10px -1px;
	height: 32px;
	font: bold 14px/32px XendroCaps, Verdana, Arial, Sans-serif;
	padding-left: 9px;
	background-color: var(--crown-color);
	color: var(--inv-txt-color);
	border-radius: 8px 8px 0 0;
}
#closeOrderWindow {
	float: right;
	cursor: pointer;
	fill: var(--inv-txt-color);
}
#closeOrderWindow:hover {
	fill: var(--theme-color);
}
#productName {
	padding: 0 10px;
	color: var(--txt-color);
}
#amount {
	margin: 0 10px;
}
#amount>div {
	display: inline-block;
	vertical-align: top;
	width: calc(50% - 5px);
}
#amount>div:first-child {
	margin-right: 10px;
}
.head {
	display: block;
	line-height: 24px;
	text-align: center;
}
.minus, .plus {
	width: 40px;
	height: 50px;
	vertical-align: top;
}
.minus {
	border-radius: 5px 0 0 5px;
}
.plus {
	border-radius: 0 5px 5px 0;
}
input.amount {
	height: 50px;
	border-radius: 0;
	border-left: none;
	border-right: none;
	text-align: center;
	width: calc(100% - 80px);
}
/* order window end */
/* home end */
/* footer */
footer {
	position: relative;
	color: var(--inv-txt-color);
	font: normal 1rem/14px XendroCaps, Verdana, Arial Sans-serif;
	padding: 10px 10px 0;
	background-color: var(--inv-bg-color);
	clear: both;
	margin: 5px 0 0;
	border-top: 5px solid var(--crown-color);
}
footer>div:not(#footerIcons):not(#footnote):not(#qrCode) {
	display: inline-block;
	vertical-align: top;
	margin: 0 10px 10px 0;
}
#qrCode {
	/*position: absolute;
	top: 53px;
	right: 10px;*/
	border: 3px solid var(--border-color);
	border-radius: 3px;
	margin: 0!important;
	display: none;
}
a.footerLink:link, a.footerLink:visited {
	color: var(--inv-txt-color);
	text-indent: -29px;
	margin: 0 0 10px 29px;
	float: left;
	clear: both;
}
a.footerLink:active, a.footerLink:hover {
	color: var(--theme-color)
}
a.footerLink>svg {
	width: 24px;
	height: 24px;
	margin-right: 5px;
	vertical-align: middle;
	fill: currentColor
}
#footerIcons {
	float: right;
	margin: 0;
}
#footerIcons>* {
	display: inline-block;
	vertical-align: top;
	margin: 0 0 0 8px;
}
#footnote {
	display: block;
	min-height: 48px;
	margin: 0;
	padding: 16px 0;
	font-size: .8rem;
	text-align: center;
	border-top: 1px solid var(--border-color);
	border-image: var(--horizontal-line);
	border-image-slice: 1;
}
#footnote h1 {
	font-size: 16px;
	white-space: nowrap;
	margin: 0 0 16px;
}
#developer {
	display: block;
	margin-bottom: 15px;
	font-size: 1rem;
	text-align: left;
}
#developer svg {
	width: 16px;
	height: 16px;
	vertical-align: middle;
	stroke: var(--crown-color);
}
#copyright {
	display: block;
	text-align: left;
}
/* footer end */
@media only screen and (min-width: 736px) {
	#cart {
		margin: 12px 15px 0 0;
	}
	#mainMenuIcon {
		margin-top: -3px;
	}
	main {
		min-height: calc(100vh - 158px);
	}
	#developer {
		float: left;
		margin-bottom: unset;
	}
	#copyright {
		float: right;
	}
	.prodRow {
		min-height: 172px;
		padding-left: 165px;
	}
	.prodName {
		font: bold 1rem/2rem XendroCaps, Verdana, Arial, Sans-serif;
	}
	.prodRow label:has(input.hidden) {
		width: 220px;
	}
	.prodDescription {
		display: inline-block;
		vertical-align: top;
		max-width: calc(100% - 215px);
	}
	.prodOptions {
		float: right;
	}
	.prodImage {
		width: 160px;
		height: 160px;
		margin-left: -160px;
	}
}
@media only screen and (min-width: 1024px) {
	body {
		padding-top: 110px;;
	}
	header {
		padding: 40px 10px 10px;
	}
	#logo, a:has(#logo) {
		height: 84px;
	}
	a:has(#logo) {
		margin-top: -30px;
	}
	#mainMenu {
		position: static;
		width: unset;
		height: 38px;
		padding: unset;
		float: right;
		background-color: transparent;
		overflow: visible;
	}
	header.scroll input:focus + label, header.scroll input:not(:placeholder-shown) + label {
		background-color: var(--inv-bg-color);
	}
	nav {
		display: inline-block;
		white-space: nowrap;
		overflow: hidden;
		/*text-overflow: ellipsis;*/
		width: calc(100vw - 539px);/* with shopping cart calc(100vw - 577px) / with shopping cart and russian calc(100vw - 625px); */
		height: 38px;
		transition: width 500ms;
	}
	nav.short {
		width: calc(100vw - 862px);/* with shopping cart calc(100vw - 900px) / with shopping cart and russian calc(100vw - 948px); */
	}
	header.scroll nav {
		width: calc(100vw - 337px);/* with shopping cart calc(100vw - 377px) / with shopping cart and russian calc(100vw - 425px); */
	}
	header.scroll nav.short {
		width: calc(100vw - 660px);/* with shopping cart calc(100vw - 700px) / with shopping cart and russian calc(100vw - 748px); */
	}
	a.menuItem {
		display: inline-block;
		vertical-align: top;
		margin: 6px 10px 0 0;
	}
	.menuSeparator {
		display:none;
	}
	a.lang .hidden, a.menuItem .hidden, #cart {
		display: none;
	}
	#flags {
		display: inline-block;
		vertical-align: top;
		padding: 0 9px;
		margin: 0 10px 0 0;
	}
	#loginForm {
		float: right;
		white-space: nowrap;
		height: 43px;
		margin-top: -5px;
		overflow: hidden;
		width: 32px;
		scroll-margin-left: 0;
		transition: width 500ms;
	}
	#loginForm.open {
		width: 355px;
	}
	#loginForm>svg {
		margin-top: 8px;
	}
	#loginForm>#loginFormHeader {
		display: none;
	}
	#LogInFormOpener {
		display: inline-block;
		fill: var(--button-color);
		cursor: pointer;
		transition: width 500ms;
	}
	header.scroll #LogInFormOpener {
		fill: var(--inv-txt-color);
	}
	#LogInFormOpener:hover, header.scroll #LogInFormOpener:hover {
		fill:var(--theme-color);
	}
	#LogInFormOpener.hiden {
		width: 0;
	}
	#loginForm>div {
		display: inline-block;
		margin-top: 5px;
		margin-right: 5px;
	}
	#loginForm>div:last-child {
		margin-right: 0;
	}
	#loginForm input[type='text'], #loginForm input[type='password'] {
		width: 175px;
	}
	#mainMenuIcon {
		display: none;
	}
	main {
		min-height: calc(100vh - 314px);
		max-width: 1000px;
		margin: 0 auto;
	}
	#qrCode {
		display: inline-block;
	}
	.prodRow {
		min-height: 212px;
		padding-left: 205px;
	}
	.prodName {
		font: bold 1rem/2rem XendroCaps, Verdana, Arial, Sans-serif;
		padding: 10px 0;
	}
	.prodImage {
		width: 200px;
		height: 200px;
		margin-left: -200px;
	}
}
@media (hover: hover) and (pointer: fine) {
	body.noScroll {
		margin-right: 17px;
	}
}