@font-face { font-family: "Oswald-fallback"; size-adjust: 70%; ascent-override: 100%; src: local('Verdana'), local(sans-serif); }
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/styles/fonts/oswald-v57-latin-ext-regular.woff2') format('woff2');
}

:root { 
    --color-primary: #B22222; 
    --color-primary-hover: #C42E2E; 
    --color-primary-disabled: rgba(178,34,34,0.3); 

    --color-secondary:  #225b27; 
    --color-secondary-hover: #7C7B5F; 

    --color-complementary: rgb(218,219,208); 

    --color-header-background: rgb(229, 224, 204);
    --color-header-items: rgb(77, 77, 75);

    --color-menu-background: #927227;
    --color-menu-text: white;
    --color-menu-ico: white;
    --color-menu-selected-background: #B22222;
    --color-menu-selected-text: white;
    --color-menu-hover-background: #B22222;
    --color-menu-hover-text: white;

    --color-menu-sub-background: var(--color-menu-selected-background);
    --color-menu-sub-text: var(--color-menu-selected-text);
    --color-menu-sub-selected-background: var(--color-menu-background);
    --color-menu-sub-selected-text: white;

    --color-section-bg: #F0F1E8; 
    --color-background: #F5F5F2; 
    --color-text: #333333; 
    --color-accent: #FFC107;

    --color-subtitle: #333333;
    --color-subtitle-background: rgb(218,219,208);

    --color-box-border: #d1d1d1;
    --color-box-background: rgb(244,245,241);
    --color-box-hover: rgb(234 232 216);

    --color-perex-background: rgb(244,245,241);

    --color-status-ok: #225b27;
    --color-status-error: #B22222;

    --color-price: #225b27; 

    --color-button-cta: white;
    --color-button-cta-hover: white;
    --color-button-cta-background: #B22222; 
    --color-button-cta-background-hover: #C42E2E;

    --color-button: white;
    --color-button-hover: white;
    --color-button-background: #225b27; 
    --color-button-background-hover: #7C7B5F;

    --color-basket-block-header-background: #9CA493;
    --color-basket-block-header-color: white;

    --color-textbox-border: silver;

    --font-family-title: 'Oswald', 'Oswald-fallback';
    --font-family-price: 'Oswald', 'Oswald-fallback';

    --icon-search: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCI+PHBhdGggZD0iTTE1LjQxNSAxMy45MTVoLS43OWwtLjI4LS4yN2E2LjQ3IDYuNDcgMCAwMDEuNTctNC4yMyA2LjUgNi41IDAgMTAtNi41IDYuNWMxLjYxIDAgMy4wOS0uNTkgNC4yMy0xLjU3bC4yNy4yOHYuNzlsNSA0Ljk5IDEuNDktMS40OS00Ljk5LTV6bS02IDBjLTIuNDkgMC00LjUtMi4wMS00LjUtNC41czIuMDEtNC41IDQuNS00LjUgNC41IDIuMDEgNC41IDQuNS0yLjAxIDQuNS00LjUgNC41eiIgZmlsbD0iIzAyMTgyOCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+');
    --icon-user: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8IS0tIENyZWF0b3I6IENvcmVsRFJBVyAtLT4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMzVweCIgaGVpZ2h0PSIzNXB4IiBzdHlsZT0ic2hhcGUtcmVuZGVyaW5nOmdlb21ldHJpY1ByZWNpc2lvbjsgdGV4dC1yZW5kZXJpbmc6Z2VvbWV0cmljUHJlY2lzaW9uOyBpbWFnZS1yZW5kZXJpbmc6b3B0aW1pemVRdWFsaXR5OyBmaWxsLXJ1bGU6ZXZlbm9kZDsgY2xpcC1ydWxlOmV2ZW5vZGQiDQp2aWV3Qm94PSIwIDAgNjYuMzc4NSA3OC4wMTQ3Ig0KIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiA8ZGVmcz4NCiAgPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCiAgIDwhW0NEQVRBWw0KICAgIC5zdHIwIHtzdHJva2U6IzlGQTU5NDtzdHJva2Utd2lkdGg6NS41Nzk3MztzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbGluZWpvaW46cm91bmR9DQogICAgLmZpbDAge2ZpbGw6bm9uZX0NCiAgIF1dPg0KICA8L3N0eWxlPg0KIDwvZGVmcz4NCiA8ZyBpZD0iVnJzdHZhX3gwMDIwXzEiPg0KICA8bWV0YWRhdGEgaWQ9IkNvcmVsQ29ycElEXzBDb3JlbC1MYXllciIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCBzdHIwIiBkPSJNMzIuMzEzMSAyLjg0MzE1Yy0wLjQxMjYyMSwwLjExNDM4NSAtMC42MzEwNjgsMC4wNzcyNzkzIC0xLjA4NTI2LDAuMDc3Mjc5MyAtMC4yMjQ4NjMsMC4wNjI0OTMgLTAuNDA3ODc5LDAuMDkyNjIzNiAtMC42MzMwMjEsMC4xNTUxMTdsLTAuNDUyMjM3IDBjLTAuNDA3ODc5LDAuMTEzMjY5IC0zLjE2NTY2LDAuNzU2NjEyIC0zLjQzNiwwLjc3NDQ2NyAtMC4zNzIxNjgsMC4xODQxMzEgLTEuODgxNzcsMC43ODM2NzQgLTIuMjYwNjMsMC44NTIwMjUgLTAuNjA1NDAxLDAuNDA5Mjc0IC0xLjk1ODIxLDEuMTEyNiAtMi43MTI1OSwxLjU0OTIxIC0wLjIzNzk3NiwwLjE5OTE5NyAtMC4yODg0NzIsMC4yNDAyMDggLTAuNTQyNjI5LDAuMzg3MjM0bC0xLjUzNzIyIDEuMzE2ODJjLTAuMTcxNTc3LDAuMjE3ODg5IC0wLjIxOTU2MywwLjI2MDg1MyAtMC40NTE5NTgsMC40NjQ3OTIgLTAuNjQ3ODA3LDAuODIxMDU4IC0xLjE0NjY0LDEuMzY4MTUgLTEuNjk2NTIsMi4yNDY0IC0wLjQ2OTgxNCwwLjc0OTYzNyAtMC43MDMzMjYsMS41NDAwMSAtMS4xOTcxMywyLjI0NjEybC0wLjM2MTg0NiAwLjMwOTk1NGMtMC4zMDIxNDMsMC4xMDM3ODMgLTAuNTI2NzI3LDAuMTY3OTUgLTAuODEzODA0LDAuMzA5Njc1IC0wLjQ5NzQzMywwLjAwOTQ4NTU1IC0yLjUwMTk1LC0wLjQ3NjIzIC0yLjg5MzY1LC0wLjI4MjYxNCAtMTAuNTgxMSwwLjY5NzQ2NyAtMTEuODYyLDEwLjk1NSAtNS45Njc4LDE2LjAwMzggMC4yNzY0NzYsMC4zNTA2ODYgMC42MjYwNDYsMC42MTM3NzEgMC45OTQ1ODgsMC45Mjk1ODQgMC4zMTQxMzksMC4xODE4OTkgMC40Mzk5NjIsMC4yOTkzNTMgMC43MjM0MTMsMC41NDIzNSAwLjI1Mzg3OCwwLjE0NzAyNiAwLjMwNDY1MywwLjE4ODAzNyAwLjU0MjYyOSwwLjM4NzIzNCAwLjczNDAxNCwwLjQyNTE3NiAxLjQyODY5LDAuOTAxNDA2IDIuMTcwMjQsMS4zMTY4MiAwLjI4OTg2NywwLjQxNDg1MyAwLjM2MzUyLDAuNzE4NjcgMC41NDIzNSwxLjE2MTk4bDAgNi4xOTY1N2MwLjIzNDYyOCwwLjYxOTkwOCAwLjA5MDY3MDcsMi44MjY0MSAwLjA5MDY3MDcsMy42NDA1IDAuMTE1Nzc5LDAuMzA2MDQ4IDAuMDkwMTEyNywwLjI4MjMzNSAwLjA5MDExMjcsMC42MTk2MyAwLjI3NjE5NywwLjM0MjAzOCAwLjE5OTE5NywwLjI1ODYyMSAwLjYzMzAyMSwwLjM4NzIzNGwwLjkwNDE5NiAwYzAuNDM2ODkzLDAuMTIxMzU5IDAuODY0ODU5LDAuMDc3NTU4MyAxLjM1NjQzLDAuMDc3NTU4M2wzNS4yNjU2IDAgMS4xNzU2NSAwYzAuNDI5MDgyLC0wLjExOTEyNyAwLjc4NjQ2NCwtMC4wNzc1NTgzIDEuMjY1NzYsLTAuMDc3NTU4MyAwLjQyOTkxOSwtMC4xMjcyMTggMC4yNjQ3NTgsLTAuMDI1NjY2OCAwLjYzMzAyMSwtMC4zMDk2NzVsMCAtMC4zMDk5NTRjMC4xNDcwMjYsLTAuMzg4MzUgMC4wOTAxMTI3LC0wLjg3ODUyOSAwLjA5MDExMjcsLTEuMzE2ODIgMC4yNjc4MjcsLTAuNzA3NTEgMC4wOTA2NzA3LC04LjM0MjgyIDAuMDkwNjcwNywtOS43NTk3OSAwLjEwMjM4OCwtMC4yNTMzMiAwLjE1NTExNywtMC4zMzMzODkgMC4xODQxMzEsLTAuNjE3OTU2bDAuMzU4MjE5IC0wLjQ2NjQ2NmMwLjY0Njk3LC0wLjE5MTY2NCAxLjI0MjYxLC0wLjM2MzI0MSAxLjg5OTA2LC0wLjU0MTUxMyAxNS42ODY2LC0zLjkxODM3IDYuMTExMiwtMjAuMjQwOCAtMy41MjY2NywtMTguMTAxMiAtMC4xMzUwMywtMC4xNDMzOTkgLTAuMjI1OTc5LC0wLjU4MjUyNCAtMC4zNjE1NjcsLTAuNzI1OTIzIC0wLjA4MDA2OTIsLTAuMzI1MDIgLTAuMTkxMzg1LC0wLjM3MTYxIC0wLjI3MTE3NSwtMC42OTY5MDkgLTAuMTU1MTE3LC0wLjE2ODIyOSAtMS41Mjk5NiwtMi4yMDMxNiAtMS42Mjc2MSwtMi40MDEyNCAtMC4yOTcxMjEsLTAuMjYwMDE2IC0wLjU4ODk0MSwtMC41NjY2MjIgLTAuODE0MDgzLC0wLjg1MjAyNWwtMS4yNjU3NiAtMS4wODQ0MmMtMC4zMTQxMzksLTAuMTgxNjIgLTAuNDM5OTYyLC0wLjI5OTM1MyAtMC43MjM0MTMsLTAuNTQyMzUgLTEuMDA3NDIsLTAuNTgyODAzIC0xLjYzODc3LC0xLjI2MTU4IC0yLjcxMjU5LC0xLjgwMDg2IC0wLjkyNTEyLC0wLjQ2NDIzNCAtMS45NzI0NCwtMC43MjQ4MDcgLTIuODAzMjYsLTEuMTM1NzUgLTAuMjY2NzExLC0wLjAxNzI5NzIgLTIuNzg1NjgsLTAuNTkxNzMxIC0zLjE2NTEsLTAuNjk2OTA5bC0wLjU0MjM1IDBjLTAuMjI0ODYzLC0wLjA2MjQ5MyAtMC40MDc4NzksLTAuMDkyNjIzNiAtMC42MzMwMjEsLTAuMTU1MTE3bC0wLjgxMzUyNSAwYy0wLjQ0MzU4OSwtMC4xMjMwMzMgLTAuOTQzNTMzLC0wLjA3NzI3OTMgLTEuNDQ3MSwtMC4wNzcyNzkzIC0wLjUyMTQyNiwtMC4xNDQ3OTQgLTEuNTcwMTQsMCAtMi4yNjAzNSwweiIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCBzdHIwIiBkPSJNMjAuMzE4NiAzNi44NjQ3YzAsLTAuMzE4NjAzIDAuMDI5NTcyNiwtMC4xOTk3NTQgLTAuMDkwNjcwNywtMC40NjQ3OTIgMC4wODAzNDgyLC0wLjE5MDU0OCAwLjA1MDc3NTYsLTAuMTMyNzk4IDAuMDkwNjcwNywtMC4zMDk5NTQgLTAuMDgwMDY5MiwtMC4xOTAyNjkgLTAuMDUwNDk2NiwtMC4xMzI3OTggLTAuMDkwNjcwNywtMC4zMDk2NzUgMC4wNDEwMTEsLTAuMTY2Mjc2IDAuMDIyMzE4OSwtMC4xMzMzNTYgMC4wOTA2NzA3LC0wLjMwOTk1NGwwIC0zLjcxODA2Ii8+DQogIDxwYXRoIGNsYXNzPSJmaWwwIHN0cjAiIGQ9Ik01Mi42NTg1IDUwLjA4OThjMC4xNzA3NCwwLjA3NjcyMTMgMC4yODc5MTQsMC4xMzg2NTYgMC40NTE5NTgsMC4yMzIzOTYgMC4yMzc5NzYsMC4xOTkxOTcgMC4yODg3NTEsMC4yNDAyMDggMC41NDI2MjksMC4zODcyMzRsMC40MzYwNTYgMC4zOTQyMDggMC4xOTY5NjUgMC4zMDI5OGMwLjAyNTk0NTgsMC4yOTA3MDQgMC4xNjk2MjQsMC44OTM1OTQgMC4yNzE0NTQsMS4xNjE3bDAgMC4zMDk5NTQgMCAwLjE1NDgzOCAwIDAuMzA5OTU0Yy0wLjA5NDAxODUsMC4yNDc3NCAtMC4xNzQwODgsMC41NzMwMzkgLTAuMTgxMDYyLDAuODUyMDI1IC0wLjI2ODk0MywwLjMxNjA5MiAtMC4xMzQ0NzIsLTAuMDE1OTAyMiAtMC4xODA3ODMsMC4zODcyMzQgLTAuMjk0MDUyLDAuMzE4ODgyIC0wLjA4NTY0ODksMC4wMDk0ODU1NSAtMC4xODEwNjIsMC4zMDk5NTQgLTAuMTI4MzM0LDAuMTM5MjE0IC0wLjE2MDY5NiwwLjE2ODIyOSAtMC4yNzExNzUsMC4zMDk2NzUgLTAuNTMwMDc1LDAuNDE5MDM4IC0wLjg5MTkyMSwwLjQyMjk0NCAtMS40NDY4MywwLjY5NzE4OCAtMC40NjkyNTYsMC4wMzA5Njc1IC0wLjQzNjMzNSwwLjA5ODQ4MjMgLTAuODEzODA0LDAuMzA5OTU0bC0wLjM2MTU2NyAwLjMwOTY3NWMtMS4zMTIzNSw1LjkzODIzIC02LjQ3NjEyLDE1LjQ1MDggLTEyLjExNywxOC4wMzU0IC00LjYwNDk1LDEuMDM2OTkgLTEwLjA2NTgsMC45Nzk4MDEgLTE0LjU1ODQsLTAuNzgzMzk1IC01LjkwNDc1LC0yLjg2NjU5IC05LjAwNTk3LC0xMS44OTkzIC0xMS4wMzE3LC0xNy4yNTJsLTAuMzYxNTY3IC0wLjMwOTY3NWMtMC4zOTA4NiwtMC4yMDA1OTEgLTAuNzE0NzY0LC0wLjI4MTc3NyAtMS4wODQ5OCwtMC40NjQ3OTIgLTAuNDAwMzQ2LC0wLjAzMzc1NzQgLTAuNDc3NjI1LC0wLjEzNzI2MSAtMC44MTQwODMsLTAuMzA5OTU0bC0wLjU0MjM1IC0wLjQ2NDUxM2MtMC4xMzUzMDksLTAuMjg4NzUxIC0wLjEyNTgyMywtMC4yODYyNCAtMC4zNjE4NDYsLTAuNTQyMzUgLTAuMDg5NTU0NywtMC40MDUwODkgLTAuMzYxNTY3LC0wLjk3ODY4NSAtMC4zNjE1NjcsLTEuMzk0MzggMCwtMC40NjM5NTUgMC4zMTc0ODcsLTEuMTM2NTkgMC4zNjQ2MzYsLTEuNjI0ODJsMC4zNTg3NzcgLTAuNDY2NDY2IDAuMzYxNTY3IC0wLjMwOTY3NWMwLjI3NTYzOSwtMC4xNTk1OCAwLjU0OTA0NiwtMC4zNTgyMTkgMC44MTM4MDQsLTAuNTQyMzUiLz4NCiAgPHBhdGggY2xhc3M9ImZpbDAgc3RyMCIgZD0iTTMyLjA5MDcgNTguMzc5NGMwLjAwNDc0Mjc3LC0wLjAxMzk0OTMgMC4wMDU4NTg3MiwtMC4wMjE0ODIgMC4wMDk3NjQ1NCwtMC4wMzU3MTAzIC0wLjAwNDc0Mjc3LC0wLjAxODEzNDEgLTAuMDA0MTg0OCwtMC4wMjQ1NTA4IC0wLjAwOTc2NDU0LC0wLjA0MjEyNyIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCBzdHIwIiBkPSJNMjIuNTM2MyA1My4zNzcxYy0wLjA1OTcwMzIsLTAuMDc0NzY4NCAtMC4wOTA5NDk3LC0wLjA5NDI5NzUgLTAuMTUyMDQ4LC0wLjE1NDgzOCAtMC4wNzYxNjM0LDAuMDc1MDQ3NCAtMC4xMDM1MDQsMC4wNjY5NTY4IC0wLjE3NzcxNSwwLjE1NDgzOCIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCBzdHIwIiBkPSJNNDAuNDExNSA1Mi42NDE3Yy0wLjA1OTcwMzIsLTAuMDc0NDg5NSAtMC4wOTA5NDk3LC0wLjA5NDAxODUgLTAuMTUyMDQ4LC0wLjE1NDgzOCAtMC4wNzU4ODQ0LDAuMDc1MDQ3NCAtMC4xMDM1MDQsMC4wNjcyMzU4IC0wLjE3NzcxNSwwLjE1NDgzOCIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCBzdHIwIiBkPSJNMjkuMTA0NSA2NS41MDE5YzAuMzAwNzQ4LDAuMDc0NzY4NCAxLjY0ODUzLDAuNzc1MDI1IDMuNjcyNTgsMC41NTI2NzMgMC45MTA4OTIsMC4wMzc5NDIyIDIuMjM5NzEsLTAuNDY1OTA4IDIuNjEzMjcsLTAuNTUzNzg5Ii8+DQogIDxwYXRoIGNsYXNzPSJmaWwwIHN0cjAiIGQ9Ik0yOC4xNTAzIDM2Ljg2NDdjMCwtMC4zMTg2MDMgMC4wMjk1NzI2LC0wLjE5OTc1NCAtMC4wOTA2NzA3LC0wLjQ2NDc5MiAwLjA4MDM0ODIsLTAuMTkwNTQ4IDAuMDUwNzc1NiwtMC4xMzI3OTggMC4wOTA2NzA3LC0wLjMwOTk1NCAtMC4wODAwNjkyLC0wLjE5MDI2OSAtMC4wNTA0OTY2LC0wLjEzMjc5OCAtMC4wOTA2NzA3LC0wLjMwOTY3NSAwLjA0MTAxMSwtMC4xNjYyNzYgMC4wMjIzMTg5LC0wLjEzMzM1NiAwLjA5MDY3MDcsLTAuMzA5OTU0bDAgLTMuNzE4MDYiLz4NCiAgPHBhdGggY2xhc3M9ImZpbDAgc3RyMCIgZD0iTTM1Ljk4MiAzNi44NjQ3YzAsLTAuMzE4NjAzIDAuMDI5NTcyNiwtMC4xOTk3NTQgLTAuMDkwNjcwNywtMC40NjQ3OTIgMC4wODAzNDgyLC0wLjE5MDU0OCAwLjA1MDc3NTYsLTAuMTMyNzk4IDAuMDkwNjcwNywtMC4zMDk5NTQgLTAuMDgwMDY5MiwtMC4xOTAyNjkgLTAuMDUwNDk2NiwtMC4xMzI3OTggLTAuMDkwNjcwNywtMC4zMDk2NzUgMC4wNDEwMTEsLTAuMTY2Mjc2IDAuMDIyMzE4OSwtMC4xMzMzNTYgMC4wOTA2NzA3LC0wLjMwOTk1NGwwIC0zLjcxODA2Ii8+DQogIDxwYXRoIGNsYXNzPSJmaWwwIHN0cjAiIGQ9Ik00My44MTM3IDM2Ljg2NDdjMCwtMC4zMTg2MDMgMC4wMjk1NzI2LC0wLjE5OTc1NCAtMC4wOTA2NzA3LC0wLjQ2NDc5MiAwLjA4MDM0ODIsLTAuMTkwNTQ4IDAuMDUwNzc1NiwtMC4xMzI3OTggMC4wOTA2NzA3LC0wLjMwOTk1NCAtMC4wODAwNjkyLC0wLjE5MDI2OSAtMC4wNTA0OTY2LC0wLjEzMjc5OCAtMC4wOTA2NzA3LC0wLjMwOTY3NSAwLjA0MTAxMSwtMC4xNjYyNzYgMC4wMjIzMTg5LC0wLjEzMzM1NiAwLjA5MDY3MDcsLTAuMzA5OTU0bDAgLTMuNzE4MDYiLz4NCiA8L2c+DQo8L3N2Zz4NCg==");
    --icon-basket: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8IS0tIENyZWF0b3I6IENvcmVsRFJBVyAtLT4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMzVweCIgaGVpZ2h0PSIzNXB4IiBzdHlsZT0ic2hhcGUtcmVuZGVyaW5nOmdlb21ldHJpY1ByZWNpc2lvbjsgdGV4dC1yZW5kZXJpbmc6Z2VvbWV0cmljUHJlY2lzaW9uOyBpbWFnZS1yZW5kZXJpbmc6b3B0aW1pemVRdWFsaXR5OyBmaWxsLXJ1bGU6ZXZlbm9kZDsgY2xpcC1ydWxlOmV2ZW5vZGQiDQp2aWV3Qm94PSIwIDAgNS43ODg1MyA1LjU0NDU5Ig0KIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiA8ZGVmcz4NCiAgPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCiAgIDwhW0NEQVRBWw0KICAgIC5zdHIwIHtzdHJva2U6IzlGQTU5NDtzdHJva2Utd2lkdGg6MC40MDE5NDU7c3Ryb2tlLWxpbmVjYXA6cm91bmR9DQogICAgLmZpbDEge2ZpbGw6bm9uZX0NCiAgICAuZmlsMCB7ZmlsbDojOUZBNTk0fQ0KICAgXV0+DQogIDwvc3R5bGU+DQogPC9kZWZzPg0KIDxnIGlkPSJWcnN0dmFfeDAwMjBfMSI+DQogIDxtZXRhZGF0YSBpZD0iQ29yZWxDb3JwSURfMENvcmVsLUxheWVyIi8+DQogIDxwYXRoIGNsYXNzPSJmaWwwIiBkPSJNMC4yODY3NDggMi40NDc4OGwyLjA3MzE1IC0wLjAyNzc3NDRjMC4wMDYxODk5NSwwLjI4OTgwMiAwLjI0MzEzNywwLjUyMjg5IDAuNTM0Mzg2LDAuNTIyODkgMC4yOTUxNDgsMCAwLjUzNDUwNiwtMC4yMzkzNTggMC41MzQ1MDYsLTAuNTM0NTA2bC00LjAxOTQ1ZS0wMDUgLTAuMDAyNzMzMjMgMi4wMzI0NyAtMC4wMjcyNTE5YzAuMjY4NjYsLTAuMDAzNjE3NSAwLjM5NjA3NywwLjI5MDg0NyAwLjI5MDE2NCwwLjYyNjU5MiAtMC4xNTI2NTksMC40ODM2MiAtMC4yODc2MzIsMC45MTEyNDkgLTAuNDA3NTcyLDEuMjkxMTcgLTAuMTA3NCwwLjM0MDA4NiAtMC4yMDQxODgsMC42NDY2ODkgLTAuMjkxODEyLDAuOTI0NDMzIC0wLjA1MDkyNjQsMC4xNjEzODEgLTAuMjI5MzksMC4yODc0MzEgLTAuMzk4Njg5LDAuMjg5MTk5IC0wLjU0NDU5NSwwLjAwNTc4ODAxIC0xLjA4OTMxLDAuMDExNjE2MiAtMS42MzI4MiwwLjAxNzM2NCAtMC41NDI2NjYsMC4wMDU3ODgwMSAtMS4wODU4NSwwLjAxMTYxNjIgLTEuNjI3OCwwLjAxNzMyMzggLTAuMTY3NzMyLDAuMDAxODA4NzUgLTAuMzU2MTYzLC0wLjExOTg2IC0wLjQyMjMyNCwtMC4yNzkxOTEgLTAuMTEzOTUxLC0wLjI3NDY0OSAtMC4yMzk2NCwtMC41Nzc1OTUgLTAuMzc5MTE0LC0wLjkxMzUgLTAuMTU1NzEzLC0wLjM3NDg5NCAtMC4zMzA4ODEsLTAuNzk2ODk2IC0wLjUyODgzOSwtMS4yNzM1NiAtMC4xMzczMDQsLTAuMzMwNjggLTAuMDQxODAyMywtMC42MjY5MTQgMC4yMjQzMjUsLTAuNjMwNDUxem0xLjc0OTA2IDIuMTcwNzRsMS43MTY5NSAwYzAuMDM2ODE4MiwwIDAuMDY3MDA0MiwwLjA1OTI0NjcgMC4wNjcwMDQyLDAuMTMxNTk3bDAgMGMwLDAuMDcyMzkwMyAtMC4wMzAxODYxLDAuMTMxNTk3IC0wLjA2NzAwNDIsMC4xMzE1OTdsLTEuNzE2OTUgMGMtMC4wMzY4NTg0LDAgLTAuMDY3MDA0MiwtMC4wNTkyMDY1IC0wLjA2NzAwNDIsLTAuMTMxNTk3bDAgMGMwLC0wLjA3MjM1MDEgMC4wMzAxNDU5LC0wLjEzMTU5NyAwLjA2NzAwNDIsLTAuMTMxNTk3em0tMC4zODc5OTcgLTAuNzM5MDE2bDIuNDkyOTQgMGMwLjA1MzQ5ODksMCAwLjA5NzI3MDcsMC4wNTkyNDY3IDAuMDk3MjcwNywwLjEzMTU5N2wwIDBjMCwwLjA3MjM5MDMgLTAuMDQzNzcxOCwwLjEzMTU5NyAtMC4wOTcyNzA3LDAuMTMxNTk3bC0yLjQ5Mjk0IDBjLTAuMDUzNDk4OSwwIC0wLjA5NzI3MDcsLTAuMDU5MjA2NSAtMC4wOTcyNzA3LC0wLjEzMTU5N2wwIDBjMCwtMC4wNzIzNTAxIDAuMDQzNzcxOCwtMC4xMzE1OTcgMC4wOTcyNzA3LC0wLjEzMTU5N3ptLTAuNDM5NTI3IC0wLjY5ODgyMWwzLjM3MiAwYzAuMDcyMzkwMywwIDAuMTMxNTk3LDAuMDU5MjQ2NyAwLjEzMTU5NywwLjEzMTU5N2wwIDBjMCwwLjA3MjM5MDMgLTAuMDU5MjA2NSwwLjEzMTU5NyAtMC4xMzE1OTcsMC4xMzE1OTdsLTMuMzcyIDBjLTAuMDcyMzkwMywwIC0wLjEzMTU5NywtMC4wNTkyMDY1IC0wLjEzMTU5NywtMC4xMzE1OTdsMCAwYzAsLTAuMDcyMzUwMSAwLjA1OTIwNjUsLTAuMTMxNTk3IDAuMTMxNTk3LC0wLjEzMTU5N3oiLz4NCiAgPGxpbmUgY2xhc3M9ImZpbDEgc3RyMCIgeDE9IjIuODk0MjkiIHkxPSIyLjQwODQ5IiB4Mj0iMi44OTQyOSIgeTI9ICIwLjIwMDk3MiIgLz4NCiAgPGNpcmNsZSBjbGFzcz0iZmlsMCIgY3g9IjIuODk0MjkiIGN5PSIyLjQwODQ5IiByPSIwLjMwMzM0OCIvPg0KIDwvZz4NCjwvc3ZnPg0K");
}

html { font-size: 100%; }

body { margin: 0px; padding: 0px; color: rgb(51,51,51); background-color: white; font-size: 1rem; font-family: Inter, -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", "Helvetica Neue", "Liberation Sans", Roboto, sans-serif; line-height: 1.5rem; text-align: center; }

form { margin: 0px; padding: 0px; }
input, option, select, textarea { font-size: 100%; }

img { border: none; }
img[align|="left"] { margin: 5px 10px 0px 0px; }
img[align|="right"] { margin: 5px 0px 0px 10px; }

a { color: rgb(51,51,51); }
a:hover { color: rgb(180,0,0); text-decoration: underline; }

table { font-size: 100%; }
td { font-size: 100%; }

label { cursor: pointer; }

h1 { font-size: 2.0rem; font-weight: normal; margin: 0; padding: 0; font-family: var(--font-family-title); line-height: 2.5rem; text-transform: uppercase; }
h2 { font-size: 1.8rem; font-weight: normal; margin: 0; padding: 0; font-family: var(--font-family-title); line-height: 2.2rem; }
h3 { font-size: 1.6rem; font-weight: normal; margin: 0; padding: 0; font-family: var(--font-family-title); }
h4 { font-size: 1.4rem; font-weight: normal; margin: 0; padding: 0; font-family: var(--font-family-title); }
h5 { font-size: 1.2rem; font-weight: normal; margin: 0; padding: 0; font-family: var(--font-family-title); }

hr { height: 1px; border: solid 1px black; }

.clear { clear: both; font-size: 1px; line-height: 1px; height: 1px; }
.clearLeft { clear: left; font-size: 1px; line-height: 1px; height: 1px; }
.clearRight { clear: right; font-size: 1px; line-height: 1px; height: 1px; }
.alignRight { text-align: right; }
.displayNone { display: none; }

.label { display: block; padding: 5px 0px 0px 0px; margin: 0px 0px 0px 0px; line-height: normal; }
.labelDescription { display: block; padding: 0px 10px 0px 5px; margin: 0px 0px 0px 0px; line-height: normal; font-size: 90%; color: gray; }

.inputItem { margin: 0px; padding: 2px; border: 1px solid gray; }

div.selectbox-wrapper ul li.selected { background: rgb(119,134,165); color: white; }
div.selectbox-wrapper ul li.current { background: rgb(217,125,28); color: white; }

.layout { border-collapse: collapse; vertical-align: top; }
.layout td { vertical-align: top; }

.table { border: solid 1px silver; border-collapse: collapse; }
.table th { border: solid 1px silver; padding: 4px; background-color: silver; font-weight: bold; }
.table td { border: solid 1px silver; padding: 4px; }
.table td.center { text-align: center; }
.table tr:hover { background-color: rgb(243,226,128); }

.visually-hidden { display: none; }

.basket-list-box { display: none; position: fixed; top: 0px; right: 0px; width: 400px; z-index: 99; margin-top: 0px; background-color: white; border: solid 1px gray; padding-bottom: 10px; text-align: left; box-shadow: 0 2px 5px rgba(0, 0, 0, .8); }
.basket-list-box .title { background-color: var(--color-box-border); font-weight: bold; padding: .5rem 1rem .5rem 1rem; color: var(--color-text); font-size: 1rem; }
.basket-list-box #branches { margin-top: 10px; padding: 5px 15px 0px 15px; border-top: solid 1px silver; text-align: center; font-size: 11pt; line-height: 1.3em; }
.basket-list-box #branches .highlight { font-weight: bold; color: rgb(7 101 9); }
.basket-list-box #branches a { font-weight: bold; }
.basket-list-box #basketContent { display: none; }
.basket-list-box #icoBasketPrint { float: right; padding: 2px 5px 0px 5px; cursor: pointer; }
.basket-list-box #imgBasketSend { float: right; padding: 2px 5px 0px 5px; cursor: pointer; }
.basket-list-box #buttons { text-align: center; padding: 10px; }
.basket-list-box #buttons a { cursor: pointer; }
.basket-list-box #buttonBasketOrder { display: inline-block; text-decoration: none; color: white; text-transform: uppercase; font-size: 1rem; font-weight: bold; padding: .5rem 1rem .5rem 1rem; background-color: #AA0000; -webkit-border-radius: 10px; border-radius: 10px; text-align: center; }
.basket-list-box #buttonBasketPrint { display: inline-block; width: 34px; height: 28px; text-decoration: none; margin: 0px 0px 0px 5px; padding-top: 7px; background-image: url('/images/ico-basket-print.png'); background-repeat: no-repeat; background-position: 50% 50%; background-color: rgb(170,173,156); -webkit-border-radius: 10px; border-radius: 10px; }
.basket-list-box #buttonBasketSend { display: none; width: 34px; height: 28px; text-decoration: none; margin: 0px 0px 0px 5px; padding-top: 7px; background-image: url('/images/ico-basket-send.png'); background-repeat: no-repeat; background-position: 50% 50%; background-color: rgb(170,173,156); -webkit-border-radius: 10px; border-radius: 10px; }
.basket-list-box #buttonBasketClear { display: inline-block; width: 34px; height: 28px; text-decoration: none; margin: 0px 0px 0px 5px; padding-top: 7px; background-image: url('/images/ico-basket-clear.png'); background-repeat: no-repeat; background-position: 50% 50%; background-color: rgb(170,173,156); -webkit-border-radius: 10px; border-radius: 10px; }
.basket-list-box .viewPort { max-height: 300px; overflow: auto; }
.basket-list-box #basketItems { width: 90%; margin: 1rem; border-collapse: collapse; }
.basket-list-box #basketItems tr td { border-bottom: dotted 1px var(--color-box-border); padding: .5rem 0 .5rem 0; font-size: .9rem; line-height: 1.4rem; vertical-align: top; }
.basket-list-box #basketItems tr td.amount { width: 4rem; white-space: nowrap; padding-right: 5px; }
.basket-list-box #basketItems tr td.price { padding-left: 15px; text-align: right; white-space: nowrap; }
.basket-list-box #basketItems tr td .itemTitle { text-decoration: none; font-weight: bold; }
.basket-list-box #basketItems tr td .itemDelete { color: red; cursor: pointer; }
.basket-list-box #basketItems tr.last td { border: none; }
.basket-list-box #sum { font-weight: bold; border-top: solid 1px rgb(135,139,116); text-align: right; padding-right: 10px; margin: 5px 10px 10px 10px; }
.basket-list-box #basketItems #templateItem { display: none; }
.basket-list-box #basketEmpty { display: none; text-align: center; padding: 20px 0px 60px 0px; color: rgb(140,140,138); background-image: url('/images/ico-basketEmpty.png'); background-repeat: no-repeat; background-position: 50% 50px; font-size: 11px; }
.basket-list-box #basketEmpty.happy { background-image: url('/images/ico-basketHappy.png'); color: rgb(228,229,224); }

#clonedBasketButton { background-image: url('/images/ico-add-to-basket-anim.svg'); width: 50px; height: 50px; z-index: 9999999; }

#header { position: sticky; top: 0px; display: block; padding-bottom: 0px; z-index: 10; transition: transform 0.6s ease; }

#header .header-background { background-color: var(--color-header-background); }

#header .header-inner { max-width: 1200px; margin: auto; width: 90vw; }

#header .header-block-top { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "logo actions"; align-items: center; gap: 0.5rem; }

#header .header-block-top .logo { position: relative; top: -4px; grid-area: logo; display: inline-flex; z-index: 60; }
#header .header-block-top .logo .logoNormal { width: auto; height: 120px; }
#header .header-block-top .logo .logoSmall { display: none; }
#header .header-block-top .logo .textAltTitle { position: absolute; bottom: 60px; left: 20px; width: 365px; z-index: 1; text-align: center; font-size: 20pt; font-family: 'Times New Roman',serif; color: rgb(62,73,40); }
#header .header-block-top .logo .textAltSubtitle { font-size: 10pt; position: absolute; bottom: 40px; left: 120px; }

#header .header-block-top .user-nav { position: relative; grid-area: actions; display: flex; align-items: center; gap: 0.5rem; }

#header .header-block-top .user-nav .user { display: inline-flex; flex-direction: column; align-items: center; gap: 0; position: relative; font-size: 0.8rem; color: var(--color-header-items); }
#header .header-block-top .user-nav .user::before { content: ""; width: 45px; height: 45px; background-color: currentColor; -webkit-mask-image: var(--icon-user); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: 45px 45px; mask-image: var(--icon-user); mask-repeat: no-repeat; mask-position: center; mask-size: 45px 45px; flex: 0 0 auto; }

#header .header-block-top .user-nav .basket-trigger { display: inline-flex; flex-direction: column; align-items: center; gap: 0; text-align: center; font-size: 0.8rem; color: var(--color-header-items); background-image: none; }
#header .header-block-top .user-nav .basket-trigger::before {  content: ""; width: 45px; height: 45px; background-color: currentColor; -webkit-mask-image: var(--icon-basket); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: 45px 45px; mask-image: var(--icon-basket); mask-repeat: no-repeat; mask-position: center; mask-size: 45px 45px; flex: 0 0 auto; }

#header .header-block-top .user-nav .basket-trigger #basketCountValue { display: none; position: absolute; z-index: 9999; top: -5px; right: 1px; width: 30px; height: 25px; text-align: center; font-size: 1rem; font-weight: bold; background-color: var(--color-primary); color: white; -webkit-border-radius: 50px; border-radius: 50px; padding: 3px 0px; }
#header .header-block-top .user-nav .basket-trigger .textLong { display: block; }
#header .header-block-top .user-nav .basket-trigger .textShort { display: none; }

#header .header-block-bottom { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "menu search"; align-items: center; gap: 0.5rem; }
#header .header-block-bottom .menu-mobile-button { grid-area: menu; display: inline-flex; border: solid 1px silver; color: white; padding: 5px 8px 5px 8px; line-height: 30px; font-size: 30px; background-color: var(--color-header-items); -webkit-border-radius: 10px; border-radius: 10px; }
#header .header-block-bottom .menu-mobile-button .sr-only { display: none; }

#header .header-block-bottom .search-box { position: relative; grid-area: search; display: flex; width: 350px; top: 2px; }
#header .header-block-bottom .search-box .inputItem { width: 100%; height: 38px; padding: 0px 45px 0px 10px; background-color: white; border: solid 1px var(--color-header-background); -webkit-border-radius: 10px; border-radius: 10px; }
#header .header-block-bottom .search-box .submit { position: absolute; top: 2px; right: 2px; border: none; width: 38px; height: 38px; -webkit-border-radius: 10px; border-radius: 10px; color: white; background-color: var(--color-header-items); background-repeat: no-repeat; background-position: center center; -webkit-mask: var(--icon-search) no-repeat center / 30px 30px; mask: var(--icon-search) no-repeat center / 30px 30px; cursor: pointer; }

#menu { position: relative; top: -21px; }
#menu .menu-main { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 1rem; padding: 0; margin: 0; list-style: none; color: var(--color-menu-text); background-color: var(--color-menu-background); box-shadow: 0 2px 5px rgba(0,0,0,.8); border-top: solid 1px white; font-family: var(--font-family-title); }
#menu .menu-main li a { display: inline-flex; flex-direction: column; align-items: center; gap: .2rem; position: relative; padding: .5rem 1rem .5rem 1rem; border-bottom: solid 1px var(--color-menu-background); font-size: 1rem; letter-spacing: 0.05em; color: var(--color-menu-text); text-decoration: none; text-transform: uppercase;  }
#menu .menu-main li a::before { content: ""; width: 35px; height: 35px; background-color: var(--color-menu-ico); -webkit-mask-image: var(--color-menu-ico); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: 30px 30px; mask-image: var(--color-menu-text); mask-repeat: no-repeat; mask-position: center; mask-size: 30px 30px; flex: 0 0 auto; }
#menu .menu-main li a:hover { color: var(--color-menu-hover-text); background-color: var(--color-menu-hover-background); border-bottom: solid 1px var(--color-menu-background); }
#menu .menu-main li.active { position: relative;z-index: 9999; top: 1px; border-left: solid 1px silver; border-right: solid 1px silver; color: var(--color-menu-selected-text); background-color: var(--color-menu-selected-background); }
#menu .menu-main li.active a { color: var(--color-menu-selected-text); border-bottom: solid 1px var(--color-menu-selected-background); }
#menu .menu-main li.version-sk { display: none; }
#menu .menu-main li.version-cz { display: none; }

#menu .menu-main li.koreni a::before { -webkit-mask-image: url('/images/menu/koreni.svg?v2'); mask-image: url('/images/menu/koreni.svg?v2'); }
#menu .menu-main li.kava a::before { -webkit-mask-image: url('/images/menu/kava.svg?v2');  mask-image: url('/images/menu/kava.svg?v2'); }
#menu .menu-main li.caj a::before { -webkit-mask-image: url('/images/menu/caj.svg?v2');  mask-image: url('/images/menu/caj.svg?v2'); }
#menu .menu-main li.bylinky a::before { -webkit-mask-image: url('/images/menu/bylinky.svg?v2');  mask-image: url('/images/menu/bylinky.svg?v2'); }
#menu .menu-main li.orechy a::before { -webkit-mask-image: url('/images/menu/orechy.svg');  mask-image: url('/images/menu/orechy.svg'); }
#menu .menu-main li.prislusenstvi a::before { -webkit-mask-image: url('/images/menu/prislusenstvi.svg?v2');  mask-image: url('/images/menu/prislusenstvi.svg?v2'); }
#menu .menu-main li.darky a::before { -webkit-mask-image: url('/images/menu/vanoce.svg?v2');  mask-image: url('/images/menu/vanoce.svg?v2'); }
#menu .menu-main li.radyRecepty a::before { -webkit-mask-image: url('/images/menu/recepty.svg?v2');  mask-image: url('/images/menu/recepty.svg?v2'); }
#menu .menu-main li.kontakty a::before { -webkit-mask-image: url('/images/menu/kontakty.svg?v2');  mask-image: url('/images/menu/kontakty.svg?v2'); }
#menu .menu-main li.version-sk a::before { -webkit-mask-image: url('/images/menu/version-sk.svg');  mask-image: url('/images/menu/version-sk.svg'); }
#menu .menu-main li.version-cz a::before { -webkit-mask-image: url('/images/menu/version-cz.svg');  mask-image: url('/images/menu/version-cz.svg'); }

#menu .menu-sub { display: flex; justify-content: center; align-items: center; gap: 1rem; border-top: solid 1px silver; border-bottom: solid 1px silver; padding: 0 0 0 0; margin: 0; background-color: var(--color-menu-sub-background); font-family: var(--font-family-title); box-shadow: 0 2px 5px rgba(0,0,0,.8);}
#menu .menu-sub a { display: block; padding: .1rem 1rem .1rem 1rem; border: solid 7px var(--color-menu-sub-background); color: var(--color-menu-sub-text); text-decoration: none; text-transform: uppercase; letter-spacing: 0.05em; -webkit-border-radius: 20px; border-radius: 20px; }
#menu .menu-sub a:hover { color: var(--color-menu-sub-selected-text); background-color: var(--color-menu-sub-selected-background); border-color: var(--color-menu-sub-background); }
#menu .menu-sub .active { color: var(--color-menu-sub-selected-text); background-color: var(--color-menu-sub-selected-background); border-color: var(--color-menu-sub-background); }

#menu .lang { position: absolute; top: 10px; right: 15px; font-size: 0.7rem; color: white; text-decoration: none; }
#menu .lang .flag { display: block; position: relative; top: 2px; width: 25px; height: 25px; overflow: hidden; margin: auto; border: solid 1px white; background-size: 37px;  background-repeat: no-repeat; background-position: -3px center; -webkit-border-radius: 50px; border-radius: 50px; }
#menu .lang .flag.cz { background-image: url('/images/flag-cz.svg'); }
#menu .lang .flag.sk { background-image: url('/images/flag-sk.svg'); }

#header.shrink { transform: translateY(calc(-1 * var(--header-height, 0px))); }
#header.shrink #menu .menu-main li a::before { display: none; }
#header.shrink .logo { display: none; }
#header.shrink .lang { top: 5px; }
#header.shrink .lang .text { display: none; }

body.darky #articleDetail.article .articleTopBlock .articleTextBlock .sectionPath { display: none; }
body.darky #section .sectionPerex {font-size: 13pt; }

#main-content { max-width: 1200px; margin: 0rem auto 0px auto; width: 90vw; text-align: left; }

.section-content-main h2,
.section-newItems h2 { position: relative; margin-top: 40px; padding: .5rem 1rem .5rem 1rem; text-transform: uppercase; font-size: 1.3rem; color: var(--color-subtitle); background-color: var(--color-subtitle-background); -webkit-border-radius: 10px; border-radius: 10px; z-index: 5; }

.section-perex { display: flow-root; background-color: var(--color-perex-background); padding: 2rem; -webkit-border-radius: 10px; border-radius: 10px; }
.section-perex h1 { font-size: 2rem; margin-bottom: 20px; text-align: center; font-family: serif; text-transform: none; }
.section-perex a { font-weight: bold; }
.section-perex a:hover { }
.section-perex p { padding: 0px; margin: 0px; }
.section-perex .more { display: none; }
.section-perex .perex-image { float: right; margin: 7px 0px 10px 30px; }
.section-perex .perex-image img { width: auto !important; height: 200px !important; -webkit-border-radius: 10px; border-radius: 10px; }

.section-perex.blog { max-width: 1000px; margin: auto; }
.section-content-main.blog { max-width: 1000px; margin: auto; }

.section-content-main.search-result h2 { margin-bottom: 1rem; }
.section-content-main.search-result h2 .highlight { font-weight: bold; }
.section-content-main.search-result .not-found { text-align: center; font-size: 1.5rem; line-height: normal; }
.section-content-main.search-result .search-box { max-width: 500px; margin: 20px auto 20px auto; padding: 2rem; text-align:center; background-color: var(--color-box-background); -webkit-border-radius: 20px; border-radius: 20px; }
.section-content-main.search-result .search-box .inputItem { width: 200px; padding: .2rem; margin: 1rem; border: solid 1px gray; -webkit-border-radius: 5; border-radius: 5px; }
.section-content-main.search-result .search-box .submit { background-color: var(--color-button-cta-background); color: var(--color-button-cta); padding: .2rem 2rem .2rem 2rem; text-decoration: none; font-size: 1rem; text-transform: uppercase; border: none; -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; }

.section-newItems h2 { margin-bottom: 20px; }
.section-newItems .buttons { text-align: center; margin: 10px 0px 20px 0px; }
.section-newItems .buttons .showAll { display: inline-block; background-color: var(--color-button-background); color: var(--color-button); text-decoration: none; font-size: 1rem; padding: .2rem 2rem .2rem 2rem; -webkit-border-radius: 10px; border-radius: 10px; }

.section-content-main h2.section-part-title { margin-bottom: 0px; }

.showFilter { display: none; }
.section-filter { position: relative; display: flow-root; top: -1rem; padding: 2rem 1rem .8rem 1rem; background-color: var(--color-box-background); -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
.section-filter a.active { font-weight: bold; }
.section-filter .button { display: inline; }

.section-filter .title { display: none; }

.section-filter .filterContent { display: flow-root; }

.section-filter .filterBox { float: left; width: 232px; margin-right: 7px; }
.section-filter .filterBox.first { margin-left: 0px; }
.section-filter .filterBox.last { margin-right: 0px; }

.section-filter .searchBox { float: right; width: 300px; text-align: right; background-color: transparent; margin: 0px; padding: 0px 10px 0px 5px; }
.section-filter .searchBox .inputItem { background-color: white; padding: 4px 5px 2px 25px; border: none; background-image: url('/images/ico-search.svg'); background-position: 5px 50%; background-repeat: no-repeat; -webkit-border-radius: 10px; border-radius: 10px; }
.section-filter .searchBox .button { background-color: #9EA594; color: white; padding: 4px 10px 4px 10px; text-decoration: none; font-size: 8pt; text-transform: uppercase; border: none; -webkit-border-radius: 20px; border-radius: 20px; cursor: pointer; }
.section-filter .searchBox .button.clear { display: none; }

.section-filter .filterTitle { display: block; border: var(--color-box-border) solid 1px; color: rgb(104,113,87); background-color: white; background-image: url('/images/arrow-down.gif'); background-position: 95% 50%; background-repeat: no-repeat; padding: 5px 10px 5px 10px; font-size: 12pt; cursor: pointer; -webkit-border-radius: 5px; border-radius: 5px; }
.section-filter .filterTitle:hover { }
.section-filter .filterTitle.down { background-image: url('/images/arrow-up.gif'); }
.section-filter .filterTitle.first { margin-left: 4px; }
.section-filter .filterTitle.last { margin-right: 0px; }
.section-filter .filterTitle .counter { display: none; position: relative; top: -2px; text-align: center; background-color: #AA0000; color: white; font-weight: bold; font-size: 8pt; padding: 2px 5px 2px 5px; -webkit-border-radius: 5px; border-radius: 5px; }

.section-filter .filterPreset { display: flow-root; margin: 10px 0px 10px 0px; border: var(--color-box-border) solid 1px; padding: 5px; background-color: white; -webkit-border-radius: 5px; border-radius: 5px; }
.section-filter .filterPreset .filterPresetTitle { display: block; font-size: 8pt; }
.section-filter .filterPreset a { display: inline-block; background-color: var(--color-subtitle-background); padding: 2px 5px 2px 5px; margin: 2px 5px 2px 0px; text-decoration: none; color: rgb(55,55,55); -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; }
.section-filter .filterPreset a.selected { background-color: #AA0000; color: white; }

.section-filter .content { display: none; position: relative; height: 300px; overflow: auto; font-size: 10pt; padding: 10px 10px 0px 10px; background-color: white; border: solid 1px #cdd0c9; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }

.section-filter .stateInput { display: block; overflow: hidden; cursor: pointer; background-repeat: no-repeat; background-position: 0px 5px; padding: 0px 0px 0px 20px; color: rgb(80,80,80); }
.section-filter .stateInput.none { background-image: url('/images/ico-check-none.png'); }
.section-filter .stateInput.yes { background-image: url('/images/ico-check-yes.png?v=2024'); font-weight: bold; }
.section-filter .stateInput.no { background-image: url('/images/ico-check-no.png?v=2024'); color: rgb(157,0,0); font-weight: bold; }
.section-filter .help { display: block; font-size: 12pt; color: rgb(60,66,49); padding-bottom: 10px; }

.section-filter .filterClear { display: none; float: right; padding: .2rem 2rem .2rem 2rem; text-decoration: none; background-color: var(--color-button-cta-background); color: var(--color-button-cta); -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; }

.filter-result { text-align: center; padding: 20px; font-weight: bold; }

.ajaxLoading { display: block; margin-bottom: 5rem; padding-top: 100px; font-size: 1rem; font-weight: bold; text-align: center; background-position: center center; background-repeat: no-repeat; background-image: url('/images/loading.gif'); }

.section-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.5rem; padding: 0rem; max-width: 1200px; margin: 1rem auto 2rem auto; }

.section-part-header { }
.section-part-description { position: relative; top: -10px; margin: 0px; padding: 1.2rem 1rem 1rem 1rem; background-color: var(--color-box-background); -webkit-border-radius: 10px; border-radius: 10px; }
.section-part-description p { margin: 0px; }

.section-list .section-card { display: grid; grid-template-rows: auto 1fr; grid-template-areas:
        "img   img"
        "title title"; gap: 0rem; position: relative; padding: 20px; border: var(--color-box-border) 1px solid; text-decoration: none; cursor: pointer; -webkit-border-radius: 10px; border-radius: 10px; }

.section-list .section-card .i { grid-area: img; margin: auto; width: 170px !important; height: 170px !important; border: none; -webkit-border-radius: 10px; border-radius: 10px; }
.section-list .section-card .t { grid-area: title; margin: 20px 0px 10px 0px; text-align: center; font-size: 1.2rem; font-weight: bold; font-family: var(--font-family-title); text-transform: uppercase; }

.product-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.5rem; padding: 0rem; max-width: 1200px; margin: 1rem 0 0 auto; }
.product-list .product-card { display: grid; grid-template-rows: auto auto 1fr auto; grid-template-columns: 1fr auto; grid-template-areas:
        "img   img"
        "title title"
        "text  text"
        "price price"
        "status button"; 
        gap: 0rem; 
        position: relative; padding: 20px; border: var(--color-box-border) 1px solid; text-decoration: none; cursor: pointer; -webkit-border-radius: 10px; border-radius: 10px; }

.product-list .product-card:hover { color: var(--color-text); background-color: var(--color-box-hover); }

.product-list .product-card .i { grid-area: img; margin: auto; border: none; -webkit-border-radius: 20px; border-radius: 20px; }
.product-list .product-card .t { grid-area: title; margin: 20px 0px 10px 0px; text-align: center; font-size: 1.2rem; font-weight: bold; font-family: var(--font-family-title); text-transform: uppercase; }
.product-list .product-card .r { grid-area: text; margin-bottom: 10px; }
.product-list .product-card .s { grid-area: status; color: var(--color-status-ok); font-size: .8rem; font-weight: bold; }
.product-list .product-card .s.o { color: var(--color-status-error); }
.product-list .product-card .p { grid-area: price; justify-self: right; margin-bottom: 10px; color: var(--color-price); font-family: var(--font-family-price); font-size: 1.3rem; font-weight: bold; }
.product-list .product-card .p .u { font-size: .8rem; font-weight: normal; }
.product-list .product-card .v { grid-area: button; padding: .2rem 1rem .2rem 1rem; text-align: center; background-color: var(--color-button-cta-background); color: var(--color-button-cta); border: none; -webkit-border-radius: 10px; border-radius: 10px; cursor: pointer; }

.product-list .product-card.pcs .i { -webkit-border-radius: 20px; border-radius: 20px; }
.product-list .product-card.pcs .p .u { display: none; }

.blog-list { display: grid; gap: 1.5rem; padding: 0rem; max-width: 1000px; margin: 0 auto; }
.blog-list .blog-card { display: grid; grid-template-columns: 350px 1fr; grid-template-rows: auto 1fr auto; grid-template-areas:
        "img title  date"
        "img text   text"
        "img button button"; gap: 0; position: relative; padding: 20px; text-decoration: none; cursor: pointer; -webkit-border-radius: 15px; border-radius: 15px; }

.blog-list .blog-card:hover { color: var(--color-text); background-color: var(--color-box-hover); }

.blog-list .blog-card .d { grid-area: date; justify-self: right; padding: .5rem 0 0 1rem; color: gray; font-size: .8rem; font-style: italic; }
.blog-list .blog-card .i { grid-area: img; width: 100% !important; height: auto !important; border: none; margin-top: .5rem; -webkit-border-radius: 10px; border-radius: 10px; }
.blog-list .blog-card .t { grid-area: title; margin: 0 0 0 1.5rem; padding: 0px; font-size: 2.2rem; line-height: normal; font-weight: normal; font-family: var(--font-family-title); text-transform: uppercase; }
.blog-list .blog-card .r { grid-area: text; margin: 0 0 0 1.5rem; line-height: 2rem; }
.blog-list .blog-card .r p { margin-top: 0; }
.blog-list .blog-card .v { grid-area: button; justify-self: right; padding: .1rem 1rem .1rem 1rem; background-color: var(--color-button-cta-background); color: var(--color-button-cta); border: none; -webkit-border-radius: 10px; border-radius: 10px; cursor: pointer; }

.section-content-main.simple-list { }
.section-content-main.simple-list .alphabet { padding: 1rem; }
.section-content-main.simple-list .alphabet a { display: inline-block; font-size: 1.2rem; width: 2.1rem; height: 2rem; text-align: center; padding-top: .2rem; margin: .2rem; font-weight: bold; text-decoration: none; color: white; background-color: var(--color-secondary); -webkit-border-radius: 20px; border-radius: 20px; }
.section-content-main.simple-list .block-header { font-size: 2rem; text-decoration: none; font-weight: bold; border-bottom: solid 1px gray; padding-bottom: 10px; margin: 2rem 0 1rem 0; }
.section-content-main.simple-list .block-header a:hover { color: WindowText; text-decoration: none; }
.section-content-main.simple-list .block-header .top { float: right; font-size: .8rem; text-decoration: none; }
.section-content-main.simple-list .item .title { font-size: 1.5rem; font-family: var(--font-family-title); padding: 1rem 0 .2rem 0; }


.article-top-block { background-color: var(--color-box-background); -webkit-border-radius: 20px; border-radius: 20px; }

.article-top-block { display: grid; max-width: 1200px; margin: 0 auto; padding: 2rem; column-gap: 2rem; row-gap: 0rem;
  grid-template-columns: 2fr 3fr;
  grid-template-rows: auto auto auto;
  grid-template-areas:
    "nav nav"
    "text price"
    "image price";
}

.navigation-path { grid-area: nav; }
.article-text-card { grid-area: text; }
.article-price-card { grid-area: price; }

.article-text-card.price-dialog { -webkit-border-radius: 20px; border-radius: 20px; max-width: 900px;
    display: grid; 
    column-gap: 2rem;
    grid-template-columns: 1fr 1.2fr; 
    grid-template-areas:
    "text price"; 
}
.article-text-card.price-dialog .article-text { grid-area: text; padding: 2rem; -webkit-border-radius: 20px; border-radius: 20px; background-color: var(--color-box-background) }
.article-text-card.price-dialog .article-text .title { font-size: 2.2rem; line-height: normal; text-transform: uppercase; font-family: var(--font-family-title); }
.article-text-card.price-dialog .article-text .perex { line-height: 1.8rem; }
.article-text-card.price-dialog .article-text .more { float: right; text-decoration: none; margin-top: 1rem; padding: .2rem 2rem .2rem 2rem; color: var(--color-button); -webkit-border-radius: 5px; border-radius: 5px; background-color: var(--color-button-background);}

.article-text-card.price-dialog .article-price-card { grid-area: price; }
.article-text-card.price-dialog .article-price-card .price-variants { margin: 0; }

.article-multimedia-card { margin: 1.5rem 0 0 0; grid-area: image; text-align: center; }
.article-multimedia-card .multimedia-gallery { margin: 0 0 1rem 0;; }
.article-multimedia-card .multimedia-gallery .article-perex-image { position: relative; margin: auto; width: 350px; height: 350px; }
.article-multimedia-card .multimedia-gallery .article-perex-image img { width: 100% !important; height: auto !important; }
.article-multimedia-card .multimedia-gallery .multimedia-list { width: 100%; margin: auto; margin: 0px; }
.article-multimedia-card .multimedia-gallery .multimedia-list .item { float: left; position: relative; width: 23.5%; height: auto; margin: 4px 3px 0px 2px; text-align: center; cursor: pointer; }
.article-multimedia-card .multimedia-gallery .multimedia-list .item .multimediaHref img { width: 100%; height: auto; border: solid 1px silver; -webkit-border-radius: 20px; border-radius: 20px; }

.article-multimedia-card .multimedia-gallery.pcs .article-perex-image { width: auto; height: auto; -webkit-border-radius: 0; border-radius: 0; }
.article-multimedia-card .multimedia-gallery.pcs .article-perex-image img { width: 100% !important; height: auto !important; -webkit-border-radius: 20px; border-radius: 20px; }

.article-multimedia-card .article-packing { }

.navigation-path { padding-left: 1rem; color: rgb(100,100,100); font-size: 10pt; }
.navigation-path ul { list-style: none; margin: 0px; padding: 0px; }
.navigation-path ul li { display: inline; }
.navigation-path ul li p { padding: 0px; margin: 0px; }
.navigation-path a { color: rgb(100,100,100); font-weight: normal; text-transform: lowercase; }
.navigation-path .separator { display: inline-block; padding: 0px 5px 0px 5px; }
.navigation-path .selected a { color: rgb(100,100,100); }

.article-top-block .article-top-header { padding: 0 1rem 0 1rem; }
.article-top-block .article-top-header .title { margin: .5rem 0 .5rem 0; font-size: 2.2rem; line-height: 2.7rem; text-transform: uppercase; font-family: var(--font-family-title); }
.article-top-block .article-top-header .perex { line-height: 1.8rem; }

.article-price-card { }
.article-price-card .price-variants { display: flex; flex-direction: column; gap: 0rem; margin-top: 1rem; background-color: white; margin-top: 1rem; padding: .5rem 1rem 0 1rem; border: solid 1px silver; -webkit-border-radius: 10px; border-radius: 10px; }
.article-price-card .price-variants .title { font-weight: bold; padding-bottom: .5rem; }
.article-price-card .price-variants .box { border: solid 1px var(--color-textbox-border); -webkit-border-radius: 10px; border-radius: 10px; margin-bottom: 1rem; }
.article-price-card .price-variants .price-variant { display: grid; grid-template-columns: 1fr auto auto auto; 
                                                        grid-template-areas: 
                                                            "packing        price         pcs           basket";
                                                        align-items: center; column-gap: .5rem; }
.article-price-card .price-variants .price-variant { background-color: rgb(222, 222, 222); padding: .5rem; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.article-price-card .price-variants .price-variant .packing { grid-area: packing; justify-self: start; }
.article-price-card .price-variants .price-variant .packing .value { font-weight: bold; }
.article-price-card .price-variants .price-variant .price { grid-area: price; justify-self: end; font-weight: bold; }
.article-price-card .price-variants .price-variant .amount { width: 3rem; text-align: center; padding: 2px; border: solid 1px var(--color-textbox-border); -webkit-border-radius: 5px; border-radius: 5px; font-weight: bold; }
.article-price-card .price-variants .price-variant .pcs { grid-area: pcs; justify-self: end; }
.article-price-card .price-variants .price-variant .addToBasket { grid-area: basket; justify-self: end; padding: 5px 10px 5px 10px; color: var(--color-button-cta); border: none; -webkit-border-radius: 5px; border-radius: 5px; background-color: var(--color-button-cta-background); cursor: pointer; }
.article-price-card .price-variants .price-variant .addToBasket:hover { background-color: var(--color-button-cta-background-hover); }
.article-price-card .price-variants .description { display: block; font-size: .8rem; font-style: italic; padding: .2rem .5rem .2rem .5rem;}
.article-price-card .price-variants.pcs .price-variant { border: none; }
.article-price-card .price-variants.pcs .price-variant .packing { display: none; }

.article-price-card .price-select-weight { display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto auto auto; grid-template-areas:
        "title title"
        "weight weight"
        "selected selected"
        "note note"; gap: .5rem; background-color: white; margin-top: 1rem; padding: 1rem; border: solid 1px silver; -webkit-border-radius: 10px; border-radius: 10px; }
.article-price-card .price-select-weight .title { grid-area: title; font-weight: bold; }
.article-price-card .price-select-weight .title .strong { color: rgb(75,120,30); font-style: italic; }
.article-price-card .price-select-weight .discount-value { display: inline-block; visibility: hidden; min-width: 5rem; text-align: center; white-space: nowrap; font-size: .9rem; padding: .1rem .7rem .2rem .7rem; background-color: rgb(75,120,30); color: white; font-weight: bold; -webkit-border-radius: 1rem; border-radius: 1rem; }
.article-price-card .price-select-weight .slide-place { grid-area: weight; }

.article-price-card .price-select-weight .selected-weight { grid-area: selected; display: grid; grid-template-columns: 1fr auto auto auto; 
                                                                grid-template-areas:
                                                                        "packing        price   pcs"
                                                                        "description    discount  discount"
                                                                        "description    basket  basket";
                                                                align-items: start; column-gap: 0; row-gap: 0; margin-top: 1.5rem; }
.article-price-card .price-select-weight .selected-weight { background-color: rgb(222, 222, 222); padding: .5rem; -webkit-border-radius: 10px; border-radius: 10px; }
.article-price-card .price-select-weight .selected-weight .packing { grid-area: packing; justify-self: start; }
.article-price-card .price-select-weight .selected-weight .packing .value { font-weight: bold; }
.article-price-card .price-select-weight .selected-weight .price { grid-area: price; justify-self: end; font-weight: bold; padding-right: .2rem; }
.article-price-card .price-select-weight .selected-weight .discount-value { grid-area: discount; margin: .5rem 0 .5rem 0; }
.article-price-card .price-select-weight .selected-weight .amount { width: 3rem; text-align: center; padding: 2px; border: solid 1px var(--color-textbox-border); -webkit-border-radius: 5px; border-radius: 5px; font-weight: bold; }
.article-price-card .price-select-weight .selected-weight .pcs { grid-area: pcs; justify-self: end; }
.article-price-card .price-select-weight .selected-weight .addToBasket { grid-area: basket; justify-self: end; padding: 5px 10px 5px 10px; color: var(--color-button-cta); border: none; -webkit-border-radius: 5px; border-radius: 5px; background-color: var(--color-button-cta-background); cursor: pointer; }
.article-price-card .price-select-weight .selected-weight .addToBasket:hover { background-color: var(--color-button-cta-background-hover); }
.article-price-card .price-select-weight .selected-weight .price-packing-amount-description { grid-area: description; font-size: .8rem; font-style: italic; padding-top: .5rem; }

.article-price-card .price-select-weight .slide-place { margin: 1rem 0 0 0; height: 60px; }
.article-price-card .price-select-weight .slide-place .ui-widget-content { background: gray; }
.article-price-card .price-select-weight .slide-place .ui-slider-horizontal { height: 10px; }
.article-price-card .price-select-weight .slide-place .ui-state-default { background: var(--color-primary); border: solid 2px white; width: 18px; height: 18px; top: -7px; cursor: pointer; -webkit-border-radius: 30px; border-radius: 30px; }

.article-price-card .price-select-weight .slide-place,
.article-price-card .price-select-weight .slide-place .ui-slider-handle { touch-action: none; -ms-touch-action: none; }

.article-price-card .price-select-weight .note { grid-area: note; }
.article-price-card .price-select-weight .serving-amount { display: block; }
.article-price-card .price-select-weight .serving-amount .value { font-weight: bold; }
.article-price-card .price-select-weight .unit-price { display: block; font-size: .8rem; }
.article-price-card .price-select-weight .discount-info { display: block; font-size: .8rem; font-style: italic; }

.article-price-card .article-price-stock-state { font-weight: bold; font-size: .8rem; padding: 1rem 1rem 0 1rem; }
.article-price-card .article-price-stock-state .onStock { display: block; color: var(--color-secondary);}
.article-price-card .article-price-stock-state .onStock .normal { font-weight: normal; }
.article-price-card .article-price-stock-state .onStock a { color: var(--color-secondary); }
.article-price-card .article-price-stock-state .outOfStock { display: block; text-align: center; color: var(--color-primary); font-size: 1rem; }

.article-price-card .article-price-stock-state .watchDogButton { display: block; width: fit-content; margin: .5rem auto 0 auto; padding: 5px 10px 5px 10px; color: var(--color-button-cta); text-decoration: none; border: none; -webkit-border-radius: 5px; border-radius: 5px; background-color: var(--color-button-cta-background); cursor: pointer; }

.article-about-store-reviews { margin-top: 2rem; padding-top: 1rem; border-top: solid 1px silver; }
.article-about-store-reviews-content { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1rem; }
.article-about-store-reviews-content .item { flex: 1 1 150px; box-sizing: border-box; padding: 10px; margin-bottom: 15px; border: solid 0px silver; text-align: center; background-color: rgb(228,229,224); -webkit-border-radius: 10px; border-radius: 10px; -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; column-break-inside: avoid; }
.article-about-store-reviews-content .item .picture { display: inline-block; width: 50px; height: 50px; background-position: 50% 50%; background-size: 100% 100%; background-color: silver; -webkit-border-radius: 50px; border-radius: 50px; }
.article-about-store-reviews-content .item .name { display: block; text-align: center; font-size: 80%; }
.article-about-store-reviews-content .item .text { display: block; text-align: left; font-size: 90%; line-height: normal; padding-top: 5px; }
.article-about-store-reviews-content .item .date { display: block; text-align: right; font-style: italic; font-size: 80%; color: gray; }
.article-about-store-reviews-content .item .rating5 { display: block; height: 20px; background-image: url('/images/rating5.png'); background-repeat: no-repeat; background-position: 50% 50%; }
.article-about-store-reviews-content .item .rating4 { display: block; height: 20px; background-image: url('/images/rating4.png'); background-repeat: no-repeat; background-position: 50% 50%; }
.article-about-store-reviews-content .item .rating3 { display: block; height: 20px; background-image: url('/images/rating3.png'); background-repeat: no-repeat; background-position: 50% 50%; }
.article-about-store-reviews-content .item .rating2 { display: block; height: 20px; background-image: url('/images/rating2.png'); background-repeat: no-repeat; background-position: 50% 50%; }
.article-about-store-reviews-content .item .rating1 { display: block; height: 20px; background-image: url('/images/rating1.png'); background-repeat: no-repeat; background-position: 50% 50%; }
.article-about-store-reviews-footer { text-align: right; }
.article-about-store-reviews-footer .link { display: inline-block; text-decoration: none; font-weight: normal; padding: .1rem 1rem .1rem 1rem; background-color: var(--color-button-cta-background); color: var(--color-button-cta); border: none; -webkit-border-radius: 10px; border-radius: 10px; cursor: pointer; }

.article-blog-main-content { max-width: 1000px; margin: 0 auto; padding: 0 0 0 0; }
.article-blog-main-content .navigation-path { margin-bottom: 1rem; padding: 0; }
.article-blog-main-content .articleDate { float: right; }
.article-blog-main-content h1 { max-width: 50%; line-height: 2.5rem; }
.article-blog-main-content .articleSubtitle { max-width: 50%; }

.article-blog-main-content .article-multimedia-card { float: right; margin: 1.5rem 0 1rem 2rem; }
.article-blog-main-content .article-multimedia-card .multimedia-gallery .article-perex-image { width: auto; height: auto; -webkit-border-radius: 0; border-radius: 0; }
.article-blog-main-content .article-multimedia-card .multimedia-gallery .article-perex-image img { max-width: 400px; width: auto !important; height: auto !important; -webkit-border-radius: 20px; border-radius: 20px; }

.article-blog-main-content .article-text { }
.article-blog-main-content .article-text .articleText { line-height: 1.8rem; margin: 0px }
.article-blog-main-content .article-text .articleText h3 { padding-top: 1rem; }
.article-blog-main-content .article-text .articleText img { -webkit-border-radius: 20px; border-radius: 20px; }
.article-blog-main-content .article-text .articleText a { font-weight: bold; }

.article-blog-main-content .article-text .tableFlow { float: right; font-size: 10pt; margin-left: 20px; }
.article-blog-main-content .article-text .tableFlow table { border: solid 1px silver; background-color: rgb(220 221 212); font-size: 10pt; }
.article-blog-main-content .article-text .tableFlow tr { border: solid 1px rgb(103,113,87); }
.article-blog-main-content .article-text .tableFlow td { border-top: solid 1px rgb(103,113,87); }

.article-blog-main-content .article-text .articleAuthor { max-width: 350px; line-height: 1.1rem; }
.article-blog-main-content .article-text .articleAuthor .photo { float: left; margin-right: 15px; border: solid 1px silver; -webkit-border-radius: 15px; border-radius: 15px; }
.article-blog-main-content .article-text .articleAuthor .author { background-color: #EFF0EE; -webkit-border-radius: 15px; border-radius: 15px; padding: 10px; }
.article-blog-main-content .article-text .articleAuthor .name { display: block; margin: 0 0 .1rem 60px; font-weight: bold; }
.article-blog-main-content .article-text .articleAuthor .company { display: block; margin: 0 0 .5rem 60px; }
.article-blog-main-content .article-text .articleAuthor .publishdate,
.article-blog-main-content .article-text .articleAuthor .updated { display: block; margin-left: 60px; font-size: .8rem; font-style: italic; }

.article-blog-main-content .article-text .products { background-color: var(--color-complementary); padding: 1rem; -webkit-border-radius: 20px; border-radius: 20px; }
.article-blog-main-content .article-text .products .product-list { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; line-height: 1.2rem; }
.article-blog-main-content .article-text .products .product-list .product-card { grid-template-columns: auto auto; background-color: white; }
.article-blog-main-content .article-text .products .product-list .product-card .i { grid-area: img; margin: auto; border: none; }
.article-blog-main-content .article-text .products .product-list .product-card .t { font-size: 1rem; }
.article-blog-main-content .article-text .products .product-list .product-card .r { font-size: .8rem; }
.article-blog-main-content .article-text .products .product-list .product-card .v { font-size: .8rem; padding: .1rem .5rem .1rem .5rem; text-align: center; }
.article-blog-main-content .article-text .products .linkMoreBlock { text-align: center; padding: 5px 0px 20px 0px; }
.article-blog-main-content .article-text .products .linkMoreBlock .linkMore { display: inline-block; margin-top: 1rem; background-color: var(--color-button-background); color: var(--color-button); text-decoration: none; padding: .2rem 2rem .2rem 2rem; -webkit-border-radius: 20px; border-radius: 20px; }

.article-blog-main-content .article-text .image { -webkit-border-radius: 20px; border-radius: 20px; border: #EFF0EE 10px solid; max-width: 350px; height: auto; }
.article-blog-main-content .article-text .imageRight { float: right; margin-left: 20px; }
.article-blog-main-content .article-text .imageLeft { float: left; margin-right: 20px; }
.article-blog-main-content .article-text .floatLeft { float: left; padding-right: 40px; }
.article-blog-main-content .article-text .floatRight { float: right; padding-left: 40px; }

.article-blog-main-content .article-text .contact { display: grid; grid-template-columns: 350px auto;
                                                        grid-template-areas:
                                                        "address map"
                                                        "address gallery"
                                                        "about   about";
                                                        gap: 1rem;
                                                        align-items: center;
                                                        margin-top: 1rem;
                                                    }

.article-blog-main-content .article-text .contact .contact-address { grid-area: address; align-self: start; }
.article-blog-main-content .article-text .contact .box { margin-bottom: 1rem; padding: 1rem; line-height: 1.5rem; background-color: var(--color-box-background); -webkit-border-radius: 10px; border-radius: 10px; }
.article-blog-main-content .article-text .contact .contact-map { grid-area: map; align-self: start; }
.article-blog-main-content .article-text .contact .contact-map .map { }
.article-blog-main-content .article-text .contact .contact-map .buttons { text-align: center; }
.article-blog-main-content .article-text .contact .contact-map .buttons .button { text-decoration: none; background-color: var(--color-button-background); color: var(--color-button); font-size: .8rem; font-weight: normal; padding: .2rem 2rem .2rem 2rem; -webkit-border-radius: 10px; border-radius: 10px; }
.article-blog-main-content .article-text .contact .contact-gallery { grid-area: gallery; display: grid; grid-template-columns: repeat(auto-fill, 140px); justify-content: space-between; gap: .2rem;  }
.article-blog-main-content .article-text .contact .contact-gallery h2 { text-align: center; padding-top: 1rem; font-size: 1.5rem; background-color: rgb(225, 230, 211); -webkit-border-radius: 10px; border-radius: 10px; }
.article-blog-main-content .article-text .contact .contact-gallery a { display: block; width: 140px; height: 140px; overflow: hidden; -webkit-border-radius: 10px; border-radius: 10px; }
.article-blog-main-content .article-text .contact .contact-gallery img { border: 1px solid silver;}
.article-blog-main-content .article-text .contact .article-about-store { grid-area: about; margin: 0; }

.article-blog-main-content .related-articles { margin: 0; }

.article-blog-main-content.vocabulary .vocabulary-table { width: 100%; border-collapse: collapse; border: solid 1px gray; }
.article-blog-main-content.vocabulary .vocabulary-table thead td { background-color: gray; color: white; }
.article-blog-main-content.vocabulary .vocabulary-table tr:nth-child(even) { background-color: rgb(232,225,225) }
.article-blog-main-content.vocabulary .vocabulary-table tr:nth-child(odd) { background: #FFF }
.article-blog-main-content.vocabulary .vocabulary-table td { padding: 5px; border: solid 1px gray; vertical-align: top; }
.article-blog-main-content.vocabulary .vocabulary-table tr:hover { background-color: yellow; }
.article-blog-main-content.vocabulary .vocabulary-table td a { display: block; text-decoration: none; color: black; }


.article-main-content { display: grid; grid-template-columns: 2fr 1fr; column-gap: 2rem; max-width: 1200px; margin: 0 auto; padding: 2rem 0 0 2rem; }
.article-main-content .article-text { grid-column: 1; }
.article-main-content .article-side-info { grid-column: 2; padding: 2rem; font-size: 1rem; background-color: var(--color-box-background); -webkit-border-radius: 20px; border-radius: 20px; }

.article-main-content .article-text header h2 { text-transform: uppercase; }
.article-main-content .article-text .articleText { line-height: 1.8rem; margin-bottom: 1rem; }
.article-main-content .article-text .articleText h3 { padding-top: 1rem; }
.article-main-content .article-text .articleText a { font-weight: bold; }

.article-main-content .article-text .articleText .grindCoffee { border: solid 2px gray; padding: .5rem 1rem 1rem 1rem; line-height: 1.2rem;  -webkit-border-radius: 20px; border-radius: 20px;  }
.article-main-content .article-text .articleText .grindCoffee h2 { font-size: 1rem; padding: 0; margin: 0; }
.article-main-content .article-text .articleText .grindCoffee p { font-size: .8rem; padding: 0; margin: 0; }
.article-main-content .article-text .articleText .grindCoffee img { float: right; padding: .5rem 0 0 .5rem; }

.article-main-content .article-attribute { margin-bottom: 20px; }
.article-main-content .article-attribute .label,
.article-main-content .article-attribute.ingredients a.label { display: block; font-family: var(--font-family-title); font-weight: normal; font-size: 1.2rem; padding-bottom: .1rem; text-decoration: none; border-bottom: none; line-height: unset; }

.article-main-content .article-attribute.kitchenType { margin: 2rem 0 0 0; padding: 1rem 2rem 1rem 2rem; background-color: var(--color-box-background); -webkit-border-radius: 20px; border-radius: 20px; }
.article-main-content .article-attribute.kitchenType .sectionsList { margin-top: 10px; }
.article-main-content .article-attribute.kitchenType .sectionsList a { float: left; width: 90px; height: 160px; overflow: hidden; margin: 0px 10px 0px 0px; text-align: center; cursor: pointer; color: rgb(80,80,80); font-size: 1rem; line-height: 1.3rem; font-family: 'Oswald', 'Oswald-fallback'; text-decoration: none; }
.article-main-content .article-attribute.kitchenType .sectionsList a img { width: 90px; height: 90px; -webkit-border-radius: 10px; border-radius: 10px; }

.article-main-content .article-attribute.recommendation { }
.article-main-content .article-attribute.recommendation .photo { float: left; margin-right: 15px; border: solid 1px silver; -webkit-border-radius: 15px; border-radius: 15px; }
.article-main-content .article-attribute.recommendation .label { padding-bottom: 10px; }
.article-main-content .article-attribute.recommendation .label abbr { text-decoration: none; }
.article-main-content .article-attribute.recommendation .label a { text-decoration: none; }
.article-main-content .article-attribute.recommendation .vcard { background-color: #EFF0EE; -webkit-border-radius: 15px; border-radius: 15px; padding: 10px; }
.article-main-content .article-attribute.recommendation .value { display: block; margin-left: 60px; }

.article-main-content .article-attribute.ingredients { }
.article-main-content .article-attribute.ingredients .item { display: inline-block; padding: 0; margin: 0; }
.article-main-content .article-attribute.ingredients .item a { text-decoration: none; text-transform: lowercase; }
.article-main-content .article-attribute.ingredients .item a:hover { text-decoration: underline; }
.article-main-content .article-attribute.ingredients .item.alergen a { font-weight: bold; }
.article-main-content .article-attribute.ingredients a { text-decoration: none; border-bottom: solid 1px silver; line-height: 0.85; }
.article-main-content .article-attribute.ingredients a:hover { border-bottom-color: rgb(51,51,51); }
.article-main-content .article-attribute.ingredients a.alergen { font-weight: bold; }
.article-main-content .article-attribute.ingredients a.nolink { border-bottom: none; }

.article-main-content .article-attribute.equivalents { margin: 2rem 0 0 0; padding: 1rem 2rem 1rem 2rem; background-color: var(--color-box-background); -webkit-border-radius: 20px; border-radius: 20px; }
.article-main-content .article-attribute.equivalents .item { float: left; width: 95px; height: 160px; margin: 10px 10px 0px 0px; text-align: center; }
.article-main-content .article-attribute.equivalents .item a { text-decoration: none; color: black; }
.article-main-content .article-attribute.equivalents .item .title { font-size: 1rem; font-family: var(--font-family-title); }
.article-main-content .article-attribute.equivalents .item .perexImage { width: 95px !important; height: auto !important; -webkit-border-radius: 10px; border-radius: 10px; }

.article-main-content .article-side-info .article-label { padding: 20px; background-color: white; margin-bottom: 30px; -webkit-border-radius: 10px; border-radius: 10px; }
.article-main-content .article-side-info .article-label .articleLabelShopBox { width: 135px; margin: auto; text-align: center; padding: 20px 20px 30px 20px; }
.article-main-content .article-side-info .article-label .labelFront { display: block; position: relative; left: -1mm; width: 35mm; height: 34mm; overflow: hidden; background-color: sandybrown; -webkit-border-radius: 35mm; border-radius: 35mm; }
.article-main-content .article-side-info .article-label .labelFront .background { position: absolute; top: 10px; left: 6px; z-index: 1; }
.article-main-content .article-side-info .article-label .articleLabelDescription { padding: 0; font-size: .9rem; }
.article-main-content .article-side-info .article-label .articleLabelMore { display: block; text-align: right; text-decoration: underline; margin-top: 5px; padding: 2px 10px 2px 10px; font-size: 90%; -webkit-border-radius: 10px; border-radius: 10px; }
.article-main-content .article-side-info .article-label .price { display: block; font-size: 1.2rem; font-weight: bold; padding: 10px 0px 10px 0px; }
.article-main-content .article-side-info .article-label .addToBasketButton { display: inline-block; text-decoration: none; color: var(--color-button-cta); padding: 7px 12px 7px 12px; margin-right: 10px; background-color: var(--color-button-cta-background); -webkit-border-radius: 10px; border-radius: 10px; text-align: center; }

.article-main-content .article-side-info .dosageConverting table { width: 100%; border-collapse: collapse; margin: 1rem 0 1rem 0; }
.article-main-content .article-side-info .dosageConverting table td { border: solid 1px silver; padding: 2px 5px 2px 5px; }
.article-main-content .article-side-info .dosageConverting table td.number { text-align: right; }
.article-main-content .article-side-info .dosageConverting p { margin: 0px; }

.article-about-store { margin: 2rem 0 0 2rem; padding: 2rem; border: solid 1px silver; -webkit-border-radius: 20px; border-radius: 20px; }
.article-about-store h2 { font-size: 2rem; font-family: var(--font-family-title); }
.article-about-store a { font-weight: bold; }
.article-about-store .aboutStorePicture { float: right; margin: 0px 0px 10px 20px; -webkit-border-radius: 10px; border-radius: 10px; }

.article-doses-box { margin: 2rem 0 0 0; padding: 0px; -webkit-border-radius: 15px; border-radius: 15px; }
.article-doses-box .title { font-family: var(--font-family-title); font-size: 1.5rem; margin: 10px 0px 10px 5px; text-transform: uppercase; }
.article-doses-box .boxContent { width: 100%; }
.article-doses-box .boxContent .overflow { width: 100%; overflow: auto; }
.article-doses-box .item { background-color: rgb(228,229,224); padding: 5px; border: solid 1px white; vertical-align: top; text-align: center; -webkit-border-radius: 15px; border-radius: 15px; }
.article-doses-box .item .image { width: 175px !important; height: 175px !important; -webkit-border-radius: 10px; border-radius: 10px; }
.article-doses-box .item .title { display: block; padding: 0px 5px 0px 5px; font-weight: normal; font-size: 1rem; text-decoration: none; color: #000000; }
.article-doses-box .item .price { display: block; padding: 0px 5px 0px 5px; color: rgb(61,73,40); font-weight: normal; font-size: 1rem; }
.article-doses-box .item .contentAmount { display: block; padding: 5px 0px 10px 0px; }
.article-doses-box .item .buy { background-color: rgb(61,73,40); color: white; padding: 2px 10px 2px 10px; font-weight: normal; text-decoration: none; text-transform: lowercase; -webkit-border-radius: 15px; border-radius: 15px; }

.related-articles { margin: 2rem 0 0 2rem; }
.related-articles .related-articles-box { margin-top: 3rem; }
.related-articles .related-articles-box .title { display: block; margin: 0rem 0px 1rem 0; padding: .5rem .5rem .5rem .5rem; background-color: var(--color-box-background); font-family: var(--font-family-title); font-size: 1.5rem; text-transform: uppercase; -webkit-border-radius: 10px; border-radius: 10px; }

.related-articles .blog-list { max-width: 100%; }
.related-articles .blog-list .blog-card { border: solid 1px var(--color-box-background); }

.member-profile { }
.member-profile h1 { font-size: 2rem; margin-bottom: 2rem; }
.member-profile h2 { font-size: 1.6rem; margin-bottom: 20px; padding: 1rem; background-color: var(--color-box-background); -webkit-border-radius: 10px; border-radius: 10px; }

.member-profile .logout { float: right; padding: .5rem 2rem .5rem 2rem; text-decoration: none; background-color: var(--color-button-cta-background); color: var(--color-button-cta); -webkit-border-radius: 10px; border-radius: 10px; cursor: pointer; }

.member-profile .order-list-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .5rem; background-color: var(--color-complementary); -webkit-border-radius: 10px; border-radius: 10px; }
.member-profile .order-list-header .date, .order-list-header .status { font-weight: bold; }
.member-profile .order-list-header .order { margin-left: auto; }
.member-profile .order-list-title { display: block; padding: .1rem 1rem .1rem 1rem; margin-top: 1rem; font-weight: normal; background-color: var(--color-box-background); -webkit-border-radius: 10px; border-radius: 10px; }
.member-profile .order-list-items { margin-bottom: 4rem; }

.member-profile .address-box { padding: 1rem; }
.member-profile .address-box .value { display: block; font-weight: bold; }
.member-profile .address-box .buttons { padding-top: 2rem; }
.member-profile .address-box .buttons .button { background-color: var(--color-button-background); color: var(--color-button); padding: .5rem 1rem .5rem 1rem; font-weight: normal; text-decoration: none; text-transform: lowercase; -webkit-border-radius: 15px; border-radius: 15px; }

.navigation-bottom { text-align: center; margin: 2rem; }
.navigation-bottom a { display: inline-block; margin: auto; padding: .5rem 4rem .5rem 4rem; text-decoration: none; background-color: var(--color-button-background); color: var(--color-button); -webkit-border-radius: 10px; border-radius: 10px; }

.page-footer { margin: 2rem 0 0 0; background-color: var(--color-complementary); text-align: center; }
.page-footer .address { margin: auto; padding: 2rem; text-align: left; max-width: 1200px; }
.page-footer .address p { margin: 0px; padding: 0px; }
.page-footer .address h4 { margin: 0px; padding: 0px; font-weight: normal; display: inline; }
.page-footer .copyright { padding: 10px; font-size: 1rem; }
.page-footer .developer a { text-decoration: none; }

#socialNetworks { text-align: center; }

#emailSubscribeForm { clear: both; background-color: #9FA594; max-width: 450px; margin: 20px auto 40px auto; padding: 2rem; -webkit-border-radius: 20px; border-radius: 20px; text-align: center; }
#emailSubscribeForm .intro { display: block; padding-bottom: 20px; }
#emailSubscribeForm .inputItem { width: 200px; background-color: white; padding: 4px 10px 4px 10px; border: none; -webkit-border-radius: 20px; border-radius: 20px; }
#emailSubscribeForm .submit { background-color: #3D4928; color: white; padding: 4px 20px 4px 20px; margin-left: 10px; border: none; -webkit-border-radius: 20px; border-radius: 20px; cursor: pointer; }
#emailSubscribeForm .validationError { display: block; padding: 10px; color: #AA0000; }
#emailSubscribeForm .confirmMessage { color: #3D4928; font-weight: bold; }

.loginBox { }
.loginBox a { }
.loginBox table { border-collapse: collapse; }
.loginBox .title { font-weight: bold; }
.loginBox .inside { padding: 0px; }
.loginBox .buttons { padding-top: 15px; }
.loginBox .lostPassword { display: block; margin: 15px; padding-top: 5px; font-size: 90%; }
.loginBox .errorMessage { font-size: 80%; }
.loginBox .validator { display: none; }

#basketNavigation { display: flex; flex-wrap: wrap; gap: 0; margin: .5rem 0px 2rem 0px; text-align: left; }
#basketNavigation .step { flex: 1 1 50px; background-color: #E4E5E0; color: #6B7360; -webkit-border-radius: 50px; border-radius: 50px; margin-right: 1rem; padding: 2px; font-size: 1rem; }
#basketNavigation .step .number { float: left; width: 32px; text-align: center; background-color: #C1C6BB; padding: 5px 0px 5px 0px; font-weight: bold; color: white; -webkit-border-radius: 50px; border-radius: 50px; border: solid 2px white; }
#basketNavigation .step .text { display: block; padding: 7px 1rem 0px 0px; margin-left: 40px; font-size: 13pt; }
#basketNavigation .step.selected { background-color: #9CA493; color: White; }
#basketNavigation .step.selected .number { background-color: #C1C6BB; color: White; }
#basketNavigation .step.last { margin-right: 0px; }


/* ORDERFORM COMMON START */
#orderForm { }
#orderForm .articleTitle { font-size: 100%; }
#orderForm .basketList { width: 99%; border-collapse: collapse; }
#orderForm .basketList td { padding: 2px 4px 2px 4px; }
#orderForm .basketList .header { background-color: #EEEEEE; color: #666666; }
#orderForm .basketList .header th { padding: 2px 4px 2px 4px; text-align: center; }
#orderForm .basketTotalSum { width: 99%; border-collapse: collapse; background-color: transparent; }
#orderForm .basketTotalSum td { text-align: right; font-weight: bold; padding: 2px 4px 2px 4px; }
#orderForm .basketBonus { width: 99%; border-collapse: collapse; background-color: transparent; }
#orderForm .basketBonus td { text-align: left; padding: 2px 4px 2px 4px; }
#orderForm .bonusRed { background-color: rgb(184,0,12); color: White; }
#orderForm .bonusRed a { color: #0000FF; }
#orderForm .basketButtons { padding: 20px 0px 20px 0px; text-align: center; }
#orderForm .basketButtons .button { border: none; background-color: silver; color: white; width: 180px; font-size: 12pt; font-weight: normal; padding: 10px; cursor: pointer; }
#orderForm .basketButtons .back { background-color: rgb(0,100,0); float: left; }
#orderForm .basketButtons .continue { font-weight: bold; background-color: #AA0000; float: right; }
#orderForm .basketButtons .clearBaskets { }
#orderForm .paying .basketList .selected, #orderForm .shipping .basketList .selected { font-weight: bold; }
#orderForm .paying .basketList .header, #orderForm .shipping .basketList .header { background-color: #EEEEEE; color: black; }
#orderForm .paying .basketList .header td, #orderForm .shipping .basketList .header td { border-bottom: solid 1px gray; }
#orderForm .paying .basketList .sum td, #orderForm .shipping .basketList .sum td { border-top: solid 1px silver; }
#orderForm .paying .basketList .description, #orderForm .shipping .basketList .description { margin-left: 20px; padding-top: 2px; font-size: 80%; display: block; }
#orderForm .termsOfTrade { margin: 20px 0px 20px 0px; }
#orderForm .rbAccount { cursor: pointer; }
#orderForm .rbAccountSelected { font-weight: bold; }
#orderForm .customerBox .description { margin-left: 20px; padding-top: 2px; font-size: 80%; display: block; }
#orderForm .loginBox .inputItem { width: 125px; }
#orderForm .loginBox .button { font-size: 90%; margin-right: 10px; }
#orderForm fieldset { width: 525px; padding-top: 10px; }
#orderForm fieldset .inside { padding: 0px 10px 10px 10px; }
#orderForm .formContent { margin-left: 20px; }
#orderForm .formLogin { margin-left: 20px; }
#orderForm .formLogin fieldset { width: 300px; }
#customerAccountLogin, #customerAccountNew { margin: 10px 0px 20px 0px; }
#customerAccountLogin .lostPassword { float: right; }
#customerAccountLogin .basketButton { width: 130px; cursor: pointer; text-align: center; background-color: rgb(184,0,12); color: White; padding: 2px 10px 2px 10px; margin: 3px 7px; }
.orderHeaderError { color: Red; }
/* ORDERFORM COMMON END */



#orderForm { padding: 10px 15px 0px 15px; }
#orderForm fieldset { width: auto; }
#orderForm h1 { padding: 0px; }

.basket-list { }
.basket-list .basket-list-item {
                                  display: grid;
                                  grid-template-columns: 70px 1fr 1fr 1fr 1fr 1fr;
                                  grid-template-rows: auto auto;
                                  grid-template-areas:
                                    "image title   title       title  title       title"
                                    "image delete  sales-unit  amount price-unit  price-sum";
                                  gap: .5rem;
                                  align-items: center;
                                }

.basket-list .basket-list-item .image { grid-area: image; align-self: start; }
.basket-list .basket-list-item .title { grid-area: title; }
.basket-list .basket-list-item .delete { grid-area: delete; }
.basket-list .basket-list-item .sales-unit { grid-area: sales-unit; justify-self: end;}
.basket-list .basket-list-item .amount { grid-area: amount; justify-self: end;}
.basket-list .basket-list-item .price-unit { grid-area: price-unit; justify-self: end;}
.basket-list .basket-list-item .price-sum { grid-area: price-sum; justify-self: end; }

.basket-list .basket-list-item { border-bottom: solid 1px var(--color-box-border); padding: 1rem; }
.basket-list .basket-list-item .image { }
.basket-list .basket-list-item .image img { -webkit-border-radius: 10px; border-radius: 10px; }
.basket-list .basket-list-item .title a { text-decoration: none; font-size: 1.2rem; }
.basket-list .basket-list-item .delete a { color: gray; text-decoration: underline; padding-left: 10px; background-image: url('/images/basket-delete.png'); background-position: 0px 6px; background-repeat: no-repeat; font-weight: normal; font-size: .8rem; }
.basket-list .basket-list-item .amount .amountCanvas { position: relative; height: 22px; padding-left: 8px; }
.basket-list .basket-list-item .amount .minus { float: left; background-image: url('/images/basket-amount-minus.png'); background-repeat: no-repeat; background-position: left center; cursor: pointer; height: 24px; width: 24px; border: solid 1px silver; -webkit-border-radius: 5px; border-radius: 5px; opacity: 0.5; }
.basket-list .basket-list-item .amount .amountLabel { float: left; display: block; background-color: White; width: 40px; text-align: center; margin: auto; padding: 3px 2px 3px 2px; font-size: 14px; }
.basket-list .basket-list-item .amount .plus { float: left; background-image: url('/images/basket-amount-plus.png'); background-repeat: no-repeat; background-position: left center; cursor: pointer; height: 24px; width: 24px; border: solid 1px silver; -webkit-border-radius: 5px; border-radius: 5px; opacity: 0.5; }
.basket-list .basket-list-item .price-sum { font-weight: bold; }

.basket-list .basket-list-item.header .amount { padding-right: 25px; }
.basket-list .basket-list-item.header:hover { background-color: transparent; }

.basket-list .basket-list-item:hover { background-color: var(--color-box-background); }
.basket-list .basket-list-item:hover .amount .minus { opacity: 1; }
.basket-list .basket-list-item:hover .amount .plus { opacity: 1; }

.basket-list .basket-list-item.outOfStock .image,
.basket-list .basket-list-item.outOfStock .title,
.basket-list .basket-list-item.outOfStock .sales-unit,
.basket-list .basket-list-item.outOfStock .price-sum,
.basket-list .basket-list-item.outOfStock .price-unit
                                            { opacity: .4; }
.basket-list .basket-list-item.outOfStock .amountCanvas { display: none; }
.basket-list .basket-list-item.outOfStock .stockStatus { display: block; color: #AA0000; }
.basket-list .basket-list-item.outOfStock .delete a { color: #AA0000; }

.basket-total-sum { text-align: right; padding-right: 1rem; }
.basket-total-sum .label { font-weight: normal; padding-bottom: .5rem; }
.basket-total-sum .value { font-weight: bold; font-size: 2rem; }

.basket-list-vatinfo { font-style: italic; text-align: right; padding: 1rem; }

#orderForm #tblOrderTotalSum.tblBasket { float: right; margin: 1rem 0 2rem 0; }
#orderForm #tblOrderTotalSum.tblBasket .title { font-weight: normal; font-size: 2rem; text-align: right; }
#orderForm #tblOrderTotalSum.tblBasket .totalPrice { font-weight: bold; font-size: 2rem; text-align: right; }
#orderForm #tblOrderTotalSum.tblBasket #voucherTotal td { border-top: solid 1px silver; vertical-align: top; font-size: 10pt; }
#orderForm #tblOrderTotalSum.tblBasket #totalPayValueVoucher, #orderForm #tblOrderTotalSum.tblBasket #totalPayValueVoucherTitle { font-size: 14pt; }

#orderForm #basketTotalSumFreeShipping { padding: 0px 10px 10px 90px; }
#orderForm #basketTotalSumFreeShipping #freeShippingText { padding: 0px 0px 5px 2px; }
#orderForm #basketTotalSumFreeShipping #freeShippingProgressBar { display: block; margin-right: 80px; background-color: rgb(239,239,236); -webkit-border-radius: 20px; border-radius: 20px; }
#orderForm #basketTotalSumFreeShipping #freeShippingProgressBarValue { background-color: #3D4928; height: 5px; color: white; padding: 2px 15px 5px 0px; text-align: right; -webkit-border-radius: 20px; border-radius: 20px; }
#orderForm #basketTotalSumFreeShipping #freeShippingProgressBarLabel { float: right; margin-top: 2px; padding: 0px 20px 0px 15px; }
#orderForm #basketTotalSumFreeShipping #upSellingTip { margin: 15px 0px 0px 0px; }
#orderForm #basketTotalSumFreeShipping #upSellingTip .text { padding-bottom: 5px; font-weight: bold; }
#orderForm #basketTotalSumFreeShipping #upSellingTip .text strong { color: #AA0000; }
#orderForm #basketTotalSumFreeShipping #upSellingTip .tipItem { float: left; width: 132px; height: 120px; overflow: hidden; margin-right: 10px; text-align: center; text-decoration: none; color: black; font-size: 10pt; }
#orderForm #basketTotalSumFreeShipping #upSellingTip .tipItem .img { display: block; width: 132px; height: 80px; overflow: hidden; -webkit-border-radius: 10px; border-radius: 10px; }
#orderForm #basketTotalSumFreeShipping #upSellingTip .tipItem.more .img { background-color: rgb(159,165,148); background-image: url(/images/menu/orechy.png); background-repeat: no-repeat; background-position: 50% 10px; }
#orderForm #basketTotalSumFreeShipping #upSellingTip .tipItem.more .title { display: block; padding-top: 38px; color: white; }

#orderForm .voucherBox { margin: 2rem 0px 2rem 0px; padding-top: 1rem; border-top: solid 1px silver; }
#orderForm .voucherBox #EnterVoucherBox { padding-top: 10px; }
#orderForm .voucherBox #EnterVoucherBox .btnCheckVoucher { background-color: #AA0000; color: white; padding: 5px 10px 5px 10px; font-size: 8pt; text-transform: uppercase; border: none; -webkit-border-radius: 20px; border-radius: 20px; cursor: pointer; }
#orderForm .voucherBox .boxContent { padding-left: 20px; }
#orderForm .voucherBox .status { display: block; max-width: 500px; padding: 5px 0px 5px 0px; font-size: 100%; font-weight: bold; }

.basket-delivery .header { font-size: 1.2rem; font-weight: bold; padding: 1rem; margin-top: 3rem; background-color: var(--color-basket-block-header-background); color: var(--color-basket-block-header-color); }

.basket-delivery .basket-delivery-item {
                                  display: grid;
                                  grid-template-columns: 70px 1fr 1fr;
                                  grid-template-rows: auto auto;
                                  grid-template-areas:
                                    "image title        price"
                                    "image description  description";
                                  gap: .5rem;
                                  align-items: center;
                                }

.basket-delivery .basket-delivery-item .image { grid-area: image; align-self: self-start; }
.basket-delivery .basket-delivery-item .title { grid-area: title; }
.basket-delivery .basket-delivery-item .price { grid-area: price; justify-self: end; }
.basket-delivery .basket-delivery-item .description { grid-area: description; }

.basket-delivery { }
.basket-delivery .basket-delivery-item { line-height: 1.2rem; padding: 2rem; border-bottom: solid 1px var(--color-box-border); cursor: pointer; }
.basket-delivery .basket-delivery-item .image { width: 50px; height: 50px; background-repeat: no-repeat; }
.basket-delivery .basket-delivery-item .title { font-size: 1rem; font-weight: bold; }
.basket-delivery .basket-delivery-item .title label { padding-left: .3rem; }
.basket-delivery .basket-delivery-item .price { font-size: 1rem; font-weight: bold; white-space: nowrap; }
.basket-delivery .basket-delivery-item .description { padding-left: 1.6rem; }
.basket-delivery .basket-delivery-item .description p { margin: 0; font-size: .9rem; }
.basket-delivery .basket-delivery-item .description .branchAddress  { display: none; margin: .5rem 0 0 0; }
.basket-delivery .basket-delivery-item .description .branchAddress .branchSelected { margin-top: 1rem; }
.basket-delivery .basket-delivery-item .description .branchAddress .branchSelected .branchValue { color: #AA0000; font-weight: bold; }
.basket-delivery .basket-delivery-item .description .branchSearch { margin: 1rem 0px 0px 0px; width: 160px; text-align: center; padding: .3rem 2rem .3rem 2rem; color: white; border-radius: 10px; background-color: var(--color-button-cta-background); font-weight: normal; }

.basket-delivery .basket-delivery-item.selected { background-color: var(--color-box-hover); }
.basket-delivery .basket-delivery-item.selected .branchAddress { display: block; }

.basket-delivery .basket-delivery-item.shippingPickUpStore .image { background-image: url('/images/ico-personal-pickup.png'); }
.basket-delivery .basket-delivery-item.shippingCzechPost .image { background-image: url('/images/ico-ceska-posta.png'); }
.basket-delivery .basket-delivery-item.shippingPPL .image { background-image: url('/images/ico-ppl.png'); }
.basket-delivery .basket-delivery-item.shippingDPD .image { background-image: url('/images/ico-dpd.png?v=2021'); }
.basket-delivery .basket-delivery-item.shippingWEDO .image { background-image: url('/images/ico-wedo.png'); }
.basket-delivery .basket-delivery-item.shippingZasilkovna .image { background-image: url('/images/ico-zasilkovna.png'); }
.basket-delivery .basket-delivery-item.shippingUlozenka .image { background-image: url('/images/ico-ulozenka.png'); }
.basket-delivery .basket-delivery-item.shippingPostomat .image { background-image: url('/images/ico-postomat.png'); }
.basket-delivery .basket-delivery-item.shippingEmail .image { background-image: url('/images/ico-pay-bank.png'); }

.basket-delivery .basket-delivery-item.payCash .image { background-image: url('/images/ico-pay-cash.png'); }
.basket-delivery .basket-delivery-item.payBank .image { background-image: url('/images/ico-pay-bank.png'); }
.basket-delivery .basket-delivery-item.payCashPost .image { background-image: url('/images/ico-pay-cash.png'); }
.basket-delivery .basket-delivery-item.payCreditCard .image { background-image: url('/images/ico-pay-card.png'); }
.basket-delivery .basket-delivery-item.payBankOnline .image{ background-image: url('/images/ico-pay-bank.png'); }

.basket-delivery .basket-delivery-note { background-color: var(--color-box-background); padding: 1rem; text-align: center; font-style: italic; margin: 1rem 0 0 0; }
.basket-delivery .basket-delivery-note p { margin: 0; padding: 0; }


#orderForm .shipping .tblBasket td.itemTitle, #orderForm .paying .tblBasket td.itemTitle { height: 70px; padding-left: 85px; background-repeat: no-repeat; background-position: 20px 7px; font-weight: bold; }
#orderForm .shipping .tblBasket td.itemPrice, #orderForm .paying .tblBasket td.itemPrice { text-align: right; padding-right: 20px; vertical-align: top; white-space: nowrap; }
#orderForm .shipping .tblBasket .selected .naPostuValue, #orderForm .shipping .tblBasket .selected .pplPartnerValue, #orderForm .shipping .tblBasket .selected .branchValue { color: #AA0000; font-weight: bold; }
#orderForm .shipping .tblBasket .naPostuValue, #orderForm .shipping .tblBasket .pplPartnerValue, #orderForm .shipping .tblBasket .branchValue { padding-left: 20px; color: inherit; font-weight: normal; }
#orderForm .shipping .tblBasket .branchSearch { display: none; margin: 5px 0px 0px 20px; width: 160px; text-align: center; padding: 2px; color: white; border-radius: 10px; background-color: #3D4928; font-size: 9pt; font-weight: normal; }


#orderForm .paying { margin-top: 20px; }
#orderForm .paying .tblBasket .payingPerex, #orderForm .shipping .tblBasket .shippingPerex { display: block; padding-left: 20px; font-size: 10pt; color: rgb(100,100,100); font-weight: normal; line-height: 1.3em; }
#orderForm .paying .tblBasket .payingPerex p, #orderForm .shipping .tblBasket .shippingPerex p { margin: 0px; padding: 0px; }
#orderForm .paying .free, #orderForm .shipping .free { color: #006600; }


#orderForm .selectableRow .selected td { background-color: rgb(213,216,197); }
#orderForm .selectableRow .selected td .branchSearch { display: block; }

#orderForm .basketConfirmVATinfo { float:right; max-width: 400px; padding: 1rem 0px 2rem 0px; font-style: italic; }


#orderForm .customerBox { text-align: left; }
#orderForm .customerBox.contact legend { background-image: url('/images/basket-contact.png'); background-position: 5px 8px; background-repeat: no-repeat; }
#orderForm .customerBox.contact legend span { margin-left: 23px; }
#orderForm .customerBox.deliveryAddress legend { background-image: url('/images/basket-address.png'); background-position: 5px 8px; background-repeat: no-repeat; }
#orderForm .customerBox.deliveryAddress legend span { margin-left: 23px; }
#orderForm .customerBox.invoice legend { background-image: url('/images/basket-company.png'); background-position: 5px 8px; background-repeat: no-repeat; }
#orderForm .customerBox.invoice legend span { margin-left: 23px; }
#orderForm .customerBox.note legend { background-image: url('/images/basket-note.png'); background-position: 5px 8px; background-repeat: no-repeat; }
#orderForm .customerBox.note legend span { margin-left: 23px; }
#orderForm .customerBox.account legend { background-image: url('/images/basket-account.png'); background-position: 5px 8px; background-repeat: no-repeat; }
#orderForm .customerBox.account legend span { margin-left: 23px; }
#orderForm .customerBox .deliveryAddressBox { }
#orderForm .customerBox .deliveryAddressBox, #orderForm .customerBox .companyBox, #orderForm .customerBox .commentaryBox { margin: 10px 20px 0px 2px; padding-top: 0px; }
#orderForm .customerBox .deliveryAddressBox .inputItem, #orderForm .customerBox .companyBox .inputItem, #orderForm .customerBox .commentaryBox .inputItem { width: 96%; }
#orderForm .customerBox .description { font-size: 90%; font-style: italic; padding-left: 8px; color: gray; }
#orderForm .customerBox .buttons { padding-bottom: 1rem;}

#orderForm .basketButtons { text-align: center; }
#orderForm .basketButtons .button { -webkit-border-radius: 10px; border-radius: 10px; text-decoration: none; margin-bottom: 10px; }
#orderForm .basketButtons .back { background-color: gray; margin-right: 10px; background-image: url('/images/basket-arrow-left.png'); background-position: 8px 50%; background-repeat: no-repeat; }
#orderForm .basketButtons .continue { background-color: #AA0000; font-weight: normal; width: 260px; background-image: url('/images/basket-arrow-right.png'); background-position: 95% 50%; background-repeat: no-repeat; }
#orderForm .basketButtons .confirm { float: none; background-color: #AA0000; font-weight: normal; width: 320px; background-position: 300px 50%; }

#orderForm .basketButtons .button { display: block; float: none; width: auto; margin: auto; padding: .5rem 4rem .5rem 4rem; }
#orderForm .basketButtons .button.continue { width: 300px; margin: 0 auto 1rem auto; }
#orderForm .basketButtons .button.confirm { padding: .5rem 2rem .5rem 2rem;  }
#orderForm .basketButtons .button.confirm .pay { display: block; font-size: .8rem; }
#orderForm .basketButtons .button.back { width: 170px; margin: 0 auto 1rem auto; padding: .5rem 1rem .5rem 1.5rem;  }


#orderForm .errorMessage { background-color: #FFC0AE; color: #AA0000; padding: 10px; text-align: left; border: solid 2px #AA0000; -webkit-border-radius: 10px; border-radius: 10px; }
#orderForm .errorMessage ul { list-style: none; margin: 0px; padding: 0px; }
#orderForm .errorMessage ul li { padding: 5px; }

#orderForm .basketOutOfStock { background-color: #FF0000; background-image: url('/images/ico-warning.svg'); background-repeat: no-repeat; background-position: 50px 50%; color: white; margin: 2rem 0 4rem 0; padding: 1rem 1rem 1rem 150px; text-align: center; font-size: 1.2rem; -webkit-border-radius: 10px; border-radius: 10px; }
#orderForm .basketOutOfStock .button { display: block; width: auto; margin: auto; padding: .5rem 4rem .5rem 4rem; background-color: silver; color: black; border: none; background-image: url('/images/basket-arrow-left.png'); background-position: 8px 50%; background-repeat: no-repeat; -webkit-border-radius: 10px; border-radius: 10px; cursor: pointer; }

#orderForm .basketCustomerDescription { width: 400px; margin: 0px auto 20px auto; color: rgb(150,150,150); }
#orderForm .basketConfirmDescription { margin: 0px auto 20px auto; color: rgb(150,150,150); }

#orderForm .orderSentConfirmed, #orderForm .basketInfo { text-align: center; font-size: 14pt; }

#orderForm .orderSentBankInfo { max-width: 400px; background-color: rgb(232, 232, 232); margin: auto; padding: 20px; text-align: left; -webkit-border-radius: 20px; border-radius: 20px; }
#orderForm .orderSentBankInfo .label { font-size: 12pt; margin: 10px 0px 2px 6px; }
#orderForm .orderSentBankInfo .value { display: block; font-size: 16pt; font-weight: bold; padding: 5px; border: solid 1px silver; -webkit-border-radius: 10px; border-radius: 10px; }
#orderForm .orderSentBankInfo .qrCode { margin: 20px; text-align: center; }
#orderForm .orderSentBankInfo .qrCode img { -webkit-border-radius: 20px; border-radius: 20px; }
#orderForm .orderSentBankInfo .qrCode .label { padding: 0px 0px 0px 0px; }
#orderForm .orderSentBankInfo .bankAccountCZ table { border-collapse: collapse; margin-bottom: 5px;}
#orderForm .orderSentBankInfo .IBANCZ { border-top: solid 1px silver; padding-left: 2px; }
#orderForm .orderSentBankInfo .IBANCZ .label { font-size: 8pt; margin: 0px; font-weight: normal; }
#orderForm .orderSentBankInfo .IBANCZ .value { border: none; padding: 0px; font-size: 10pt; }

#orderForm .basketError { color: #AA0000; padding: 20px 0px 20px 0px; text-align: center; }

#orderForm.orderConfirm { padding-bottom: 40px; }
#orderForm.orderConfirm .confirmOrderList { width: 100%; border-collapse: collapse; font-size: 110%; }
#orderForm.orderConfirm .confirmOrderList th { font-size: 12pt; font-weight: bold; color: gray; border-bottom: solid 4px silver; text-align: left; }
#orderForm.orderConfirm .confirmOrderList td { vertical-align: top; padding-top: 5px; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order { width: 100%; border-collapse: collapse; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order td { padding: 5px 0px 5px 0px; border-bottom: solid 1px silver; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order .totalPrice { text-align: right; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.totalSum { border-top: solid 4px silver; font-weight: bold; font-size: 11pt; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.totalSum .totalSumPrice { text-align: right; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.totalSum td { border-bottom: none; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.totalSum .voucher { font-weight: normal; color: green; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.paying td { border-top: solid 3px silver; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .basketConfirmVATinfo { display: block; text-align: right; }

#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.outOfStock { color: silver; }
#orderForm.orderConfirm .confirmOrderList td.orderItems .order tr.outOfStock .amountAndTitle em { color: #FF0000; font-weight: normal; }

#orderForm.orderConfirm .termsOfTrade { text-align: center; display: none; }
#orderForm.orderConfirm .termsOfTrade .chkTermsOfTrade { position: relative; z-index: 99; }
#orderForm.orderConfirm .termsOfTrade label { padding-left: 5px; }
#orderForm.orderConfirm .errorValidator { display: none; }
#orderForm.orderConfirm .errorMessage { position: absolute; background-image: url('/images/arrow-draft.png'); background-repeat: no-repeat; padding: 35px 0px 0px 28px; text-align: left; background-color: transparent; border: none; }

#orderCustomer { width: 400px; margin: auto; text-align: center; }
#orderCustomer .checkbox label { padding-left: 5px; }

#orderCustomer .loggedUser { background-color: rgb(201,203,192); color: #3D4928; margin-bottom: 20px; padding: 10px; text-align: left; -webkit-border-radius: 10px; border-radius: 10px; }
#orderCustomer .loggedUser .logOut { float: right; }
#orderCustomer .newMember { background-color: #3D4928; color: white; margin-right: 20px; padding: 5px 20px 5px 20px; text-decoration: none; font-size: 12pt; border: none; -webkit-border-radius: 20px; border-radius: 20px; cursor: pointer; }

#orderCustomer .customerBox { margin-bottom: 20px; padding: 0px; background-color: rgb(228,229,224); -webkit-border-radius: 10px; border-radius: 10px; }
#orderCustomer .customerBox fieldset { border: none; padding: 0px 0px 0px 0px; margin: auto; }
#orderCustomer .customerBox fieldset legend { display: block; background-color: rgb(201,203,192); width: 100%; padding: 0px; margin: 0px; -webkit-border-top-left-radius: 10px; border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; border-top-right-radius: 10px }
#orderCustomer .customerBox fieldset legend span { display: block; padding: 10px; color: #3D4928; font-size: 12pt; }
#orderCustomer .customerBox fieldset .inside { padding: 0px 0px 20px 10px; }
#orderCustomer .customerBox .inputItem { width: 90%; font-size: 10pt; padding: 5px; border: solid 2px rgb(200,200,200); -webkit-border-radius: 10px; border-radius: 10px; }
#orderCustomer .customerBox .inputItem:focus { background-color: #FEF5C2; }
#orderCustomer .customerBox .inputItem.error { border-color: #AA0000; }
#orderCustomer .customerBox .label { font-size: 10pt; color: gray; padding: 10px 0px 1px 5px; }
#orderCustomer .customerBox .label .asterisk { padding-left: 5px; }
#orderCustomer .customerBox .requiredFields { display: none; }
#orderCustomer .customerBox .checkbox { display: block; padding: 20px 0px 0px 0px; }
#orderCustomer .customerBox .errorValidator { display: none; }
#orderCustomer .customerBox .rbAccount label { padding-left: 5px; font-size: 110%; font-weight: bold; }
#orderCustomer .customerBox .rbAccount label .description { padding: 0px 0px 0px 5px; font-size: 90%; font-weight: normal; }
#orderCustomer .customerBox .newRegistrationBox { padding-left: 22px; }
#orderCustomer .customerBox .basketNewRegistrationDescription { font-size: 85%; color: rgb(135,139,116); padding-left: 5px; }
#orderCustomer .customerBox .buttons .button { float: right; background-color: #AA0000; color: white; margin-right: 20px; padding: 5px 20px 5px 20px; text-decoration: none; font-size: 12pt; border: none; -webkit-border-radius: 20px; border-radius: 20px; cursor: pointer; }
#orderCustomer .customerBox .buttons .lostPassword { float: left; padding-top: 8px; }

#orderForm .errorBox .error { display: block; clear: both; padding: 20px; text-align: center; font-size: 120%; font-weight: bold; }

#valSummary { text-align: left; }
#valSummary ul { }
#valSummary ul li { padding-bottom: 10px; }

#savingOrder { display: none; text-align: center; margin: 40px; }
#savingOrder .messageText { display: block; font-size: 140%; padding-bottom: 20px; }

.myOrderCustomerName { text-align: center; font-style: italic; padding: 5px 0px 10px 0px; font-size: 14pt; }

.msgBox .error { display: block; text-align: center; padding: 20px; color: #AA0000; }

#floatedBanner { position: fixed; display: none; z-index: 99999; }
#floatedBanner p { padding: 0px; margin: 0px; }

/******* fancybox custom  ************/
.fancybox-bg { background-color: silver; opacity: 0.5; }
.fancybox-image, .fancybox-spaceball { -webkit-border-radius: 27px; border-radius: 27px; border: solid 20px #EFF0EE; }
.fancybox-slide--iframe .fancybox-content { -webkit-border-radius: 10px; border-radius: 10px; }
/******* fancybox end *******/

/****** autocomplete - vyhledavani *****/
.ui-autocomplete { position: fixed; width: 220px; _height: 300px; max-height: 300px; overflow-y: auto; overflow-x: hidden; padding-right: 10px; z-index: 9999; -webkit-border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; }
.ui-autocomplete .category { display: block; text-align: left; font-weight: normal; padding: 2px 0px 2px 6px; border-bottom: solid 1px silver; }
.ui-menu-item .perexImage { width: 30px; height: 30px; margin-right: 5px; }
.ui-menu-item { float: left; clear: left; }
.ui-menu-item td { vertical-align: middle; text-align: left; font-size: 13pt; }
.ui-menu-item .highlite { font-weight: bold; }

/***** dialogs */
.dialog { padding: 0px 8px 0px 8px; }
.dialog .header { background-color: rgb(204,204,199); color: rgb(51,51,51); padding: 5px 5px 5px 7px; -webkit-border-radius: 10px; border-radius: 10px; }
.dialog .header .title { font-size: 12pt; font-weight: normal; text-transform: uppercase; color: gray; font-family: 'Oswald', 'Oswald-fallback'; }
.dialog .header .close { float: right; padding: 1px 8px 1px 8px; background-color: gray; font-size: 12pt; font-weight: bold; color: white; -webkit-border-radius: 7px; border-radius: 7px; cursor: pointer; }
.ui-dialog { z-index: 99999; }
.ui-dialog .ui-dialog-titlebar-close { display: none; }
.ui-dialog-buttonset .ui-button { background-image: none; -webkit-border-radius: 5px; border-radius: 5px; border: solid 1px gray; padding: 5px 20px 5px 20px; }
.ui-dialog-buttonset .submitButton { background-color: #6C7461; color: white; }
.ui-dialog-buttonset .watchDogButton { background-color: #9EA594; color: white; }

.ui-widget-overlay { background: rgba(0,0,0,0.8); opacity: .8; }
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button.btn-ok { background-color: var(--color-button-cta-background); color: var(--color-button-cta); font-weight: bold; }
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button.btn-cancel  { background-color: var(--color-button-background); color: var(--color-button); }


/*! jQuery-ui-Slider-Pips - v1.11.4 - 2025-07-08 */
.ui-slider-horizontal.ui-slider-pips{margin-bottom:1.4em}.ui-slider-pips .ui-slider-label,.ui-slider-pips .ui-slider-pip-hide{display:none}.ui-slider-pips .ui-slider-pip-label .ui-slider-label{display:block}.ui-slider-pips .ui-slider-pip{width:2em;height:1em;line-height:1em;position:absolute;font-size:.8em;color:#999;overflow:visible;text-align:center;top:20px;left:20px;margin-left:-1em;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui-state-disabled.ui-slider-pips .ui-slider-pip{cursor:default}.ui-slider-pips .ui-slider-line{background:#999;width:1px;height:3px;position:absolute;left:50%}.ui-slider-pips .ui-slider-label{position:absolute;top:5px;left:50%;margin-left:-1em;width:2em}.ui-slider-pips:not(.ui-slider-disabled) .ui-slider-pip:hover .ui-slider-label{color:#000;font-weight:bold}.ui-slider-vertical.ui-slider-pips{margin-bottom:1em;margin-right:2em}.ui-slider-vertical.ui-slider-pips .ui-slider-pip{text-align:left;top:auto;left:20px;margin-left:0;margin-bottom:-0.5em}.ui-slider-vertical.ui-slider-pips .ui-slider-line{width:3px;height:1px;position:absolute;top:50%;left:0}.ui-slider-vertical.ui-slider-pips .ui-slider-label{top:50%;left:.5em;margin-left:0;margin-top:-0.5em;width:2em}.ui-slider-float .ui-slider-handle:focus,.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,.ui-slider-float .ui-slider-handle:focus .ui-slider-tip-label,.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label{outline:none}.ui-slider-float .ui-slider-tip,.ui-slider-float .ui-slider-tip-label{position:absolute;visibility:hidden;top:-40px;display:block;width:34px;margin-left:-18px;left:50%;height:20px;line-height:20px;background:#fff;border-radius:3px;border:1px solid #888;text-align:center;font-size:12px;opacity:0;color:#333;-webkit-transition-property:opacity,top,visibility;transition-property:opacity,top,visibility;-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;-webkit-transition-duration:200ms,200ms,0ms;transition-duration:200ms,200ms,0ms;-webkit-transition-delay:0ms,0ms,200ms;transition-delay:0ms,0ms,200ms}.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label{opacity:1;top:-30px;visibility:visible;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;-webkit-transition-delay:200ms,200ms,0ms;transition-delay:200ms,200ms,0ms}.ui-slider-float .ui-slider-pip .ui-slider-tip-label{top:42px}.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label{top:32px;font-weight:normal}.ui-slider-float .ui-slider-tip:after,.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after{content:" ";width:0;height:0;border:5px solid hsla(0,0%,100%,0);border-top-color:#fff;position:absolute;bottom:-10px;left:50%;margin-left:-5px}.ui-slider-float .ui-slider-tip:before,.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before{content:" ";width:0;height:0;border:5px solid hsla(0,0%,100%,0);border-top-color:#888;position:absolute;bottom:-11px;left:50%;margin-left:-5px}.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after{border:5px solid hsla(0,0%,100%,0);border-bottom-color:#fff;top:-10px}.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before{border:5px solid hsla(0,0%,100%,0);border-bottom-color:#888;top:-11px}.ui-slider-vertical.ui-slider-float .ui-slider-tip,.ui-slider-vertical.ui-slider-float .ui-slider-tip-label{top:50%;margin-top:-11px;width:34px;margin-left:0px;left:-60px;color:#333;-webkit-transition-duration:200ms,200ms,0;transition-duration:200ms,200ms,0;-webkit-transition-property:opacity,left,visibility;transition-property:opacity,left,visibility;-webkit-transition-delay:0,0,200ms;transition-delay:0,0,200ms}.ui-slider-vertical.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,.ui-slider-vertical.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label{top:50%;margin-top:-11px;left:-50px}.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label{left:47px}.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label{left:37px}.ui-slider-vertical.ui-slider-float .ui-slider-tip:after,.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after{border:5px solid hsla(0,0%,100%,0);border-left-color:#fff;border-top-color:rgba(0,0,0,0);position:absolute;bottom:50%;margin-bottom:-5px;right:-10px;margin-left:0;top:auto;left:auto}.ui-slider-vertical.ui-slider-float .ui-slider-tip:before,.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before{border:5px solid hsla(0,0%,100%,0);border-left-color:#888;border-top-color:rgba(0,0,0,0);position:absolute;bottom:50%;margin-bottom:-5px;right:-11px;margin-left:0;top:auto;left:auto}.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after{border:5px solid hsla(0,0%,100%,0);border-right-color:#fff;right:auto;left:-10px}.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before{border:5px solid hsla(0,0%,100%,0);border-right-color:#888;right:auto;left:-11px}.ui-slider-pips [class*=ui-slider-pip-initial]{font-weight:bold;color:black}.ui-slider-pips .ui-slider-pip-initial-2{color:#1897c9}.ui-slider-pips [class*=ui-slider-pip-selected]{font-weight:bold;color:#ff7a00}.ui-slider-pips .ui-slider-pip-inrange{color:#000}.ui-slider-pips .ui-slider-pip-selected-2{color:#e70081}.ui-slider-pips [class*=ui-slider-pip-selected] .ui-slider-line,.ui-slider-pips .ui-slider-pip-inrange .ui-slider-line{background:#000}

.ui-slider-pips .ui-slider-pip { color: var(--color-text); }

.sliderSelectWeight .ui-slider-pip { top: 3px; }
.sliderSelectWeight .ui-slider-pip .ui-slider-line { width: 5px; height: 5px; border-radius: 6px; margin-left: -3px; margin-top: -1px; background: white; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-first .ui-slider-line { border: 5px gray solid; margin-top: -5px; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-first .ui-slider-label { margin-left: -15px; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-last .ui-slider-line { border: 5px gray solid; margin-left: -7px; margin-top: -6px; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-last .ui-slider-label { margin-left: -20px; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-selected-initial { font-weight: normal; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-selected { font-weight: bold; }
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-selected,
.sliderSelectWeight .ui-slider-pip.ui-slider-pip-selected-initial,
.sliderSelectWeight .ui-slider-pips [class*="ui-slider-pip-initial"]  { color: black; }

.sliderSelectWeight.ui-slider-pips .ui-slider-label { top: -22px; font-size: 12px; width: 40px; margin-left: -20px; }
.sliderSelectWeight.ui-slider-pips .ui-slider-label .unit { font-size: 75%; padding-left: 1px; }
.sliderSelectWeight.ui-slider-pips .ui-slider-label .sale5 { display: block; position: absolute; top: 25px; left: -10px; width: 60px; height: 79px;  background-repeat: no-repeat; background-size: 60px; opacity: 0.75; filter: alpha(opacity=25) }
.sliderSelectWeight.ui-slider-pips .ui-slider-label .sale10 { display: block; position: absolute; top: 25px; left: -10px; width: 60px; height: 79px; background-repeat: no-repeat; background-size: 60px; opacity: 0.75; filter: alpha(opacity=50) }
.sliderSelectWeight.ui-slider-pips .ui-slider-label .sale15 { display: block; position: absolute; top: 25px; left: -10px; width: 60px; height: 79px; background-repeat: no-repeat; background-size: 60px; opacity: 0.75; filter: alpha(opacity=75) }
.sliderSelectWeight.ui-slider-pips .ui-slider-label .sale20 { display: block; position: absolute; top: 25px; left: -10px; width: 60px; height: 79px; background-repeat: no-repeat; background-size: 60px; }

html[lang="cs"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale5 { background-image: url('/images/ico-sale-5.svg'); }
html[lang="cs"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale10 { background-image: url('/images/ico-sale-10.svg'); }
html[lang="cs"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale15 { background-image: url('/images/ico-sale-15.svg'); }
html[lang="cs"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale20 { background-image: url('/images/ico-sale-20.svg'); }

html[lang="sk"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale5 { background-image: url('/images/ico-sale-5-sk.svg'); }
html[lang="sk"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale10 { background-image: url('/images/ico-sale-10-sk.svg'); }
html[lang="sk"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale15 { background-image: url('/images/ico-sale-15-sk.svg'); }
html[lang="sk"] .sliderSelectWeight.ui-slider-pips .ui-slider-label .sale20 { background-image: url('/images/ico-sale-20-sk.svg'); }

.yt-container {
  position: relative;
  cursor: pointer;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  overflow: hidden;
}

.yt-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.yt-container:hover .yt-thumbnail {
  transform: scale(1.05);
}

.yt-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 48px;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  cursor: pointer;
  line-height: 0;
  transition: background 0.3s;
}

.yt-container:hover .yt-play {
  background: rgba(255, 0, 0, 0.8);
}



@media (min-width: 850px) {
  #header .header-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; row-gap: 0; column-gap: 1rem; 
    grid-template-areas: 
      "search logo user-nav";    
  }

  #header .header-block-top,
  #header .header-block-bottom { display: contents; }

  #header .header-block-bottom .search-box { grid-area: search; }
  #header .header-block-top .logo { grid-area: logo; justify-self: start; }
  #header .header-block-top .user-nav { grid-area: user-nav; justify-self: end; display: flex; }

  #header .header-block-bottom .menu-mobile-button { display: none; }

}

@media (max-width: 849.98px) {

    #header { background-color: var(--color-header-background); }

    #header .header-inner { padding-bottom: 10px; }

    #header .header-block-top .logo .logoNormal { display: none; }
    #header .header-block-top .logo .logoSmall { display: block; height: 50px; }
    
    #header .header-block-top .user-nav { top: 5px; }
    #header .header-block-top .user-nav a { text-decoration: none; color: gray; }
    #header .header-block-top .user-nav .user { font-size: 10px; line-height: 12px; }
    #header .header-block-top .user-nav .user::before { width: 30px; height: 30px; mask-size: 30px 30px; -webkit-mask-size: 30px 30px; }

    #header .header-block-top .user-nav .basket-trigger { font-size: 10px; margin-right: 5px; line-height: 12px; }
    #header .header-block-top .user-nav .basket-trigger::before { width: 30px; height: 30px; mask-size: 30px 30px; -webkit-mask-size: 30px 30px; }
    #header .header-block-top .user-nav .basket-trigger .textLong { display: none; }
    #header .header-block-top .user-nav .basket-trigger .textShort { display: block; }
    #header .header-block-top .user-nav .basket-trigger #basketCountValue { right: -7px;  font-size: 10px; line-height: 18px; width: 20px; height: 20px; padding: 0px; }

    #header .header-block-bottom { margin-top: 5px; }
    #header .header-block-bottom .search-box { top: 0; width: 100%; }

    #header .header-block-bottom .menu-mobile-button { }

    #menu { top: 0; }

    #menu .menu-main { display: none; flex-direction: column; gap: 0; position: fixed; justify-content: flex-start; align-items: start; left: 0; right: 0; top: calc(var(--header-height, 56px)); bottom: 0; overflow: auto; -webkit-overflow-scrolling: touch; z-index: 999; list-style: none; margin: 0; padding: 0; }
    #menu .menu-main.is-open { display: flex; }

    #menu .menu-main li { border-bottom: solid 1px silver; width: 100%; text-align: left; }
    #menu .menu-main li a::before { width: 30px; height: 30px; -webkit-mask-size: 30px 30px; mask-size: 30px 30px; }
    #menu .menu-main li a { flex-direction: row; align-items: center; gap: .5rem; width: 100%; padding: .5rem; font-size: 1rem; }
    #menu .menu-main li.version-sk { display: block; }
    #menu .menu-main li.version-cz { display: block; }

    #menu .menu-sub { display: flex; flex-wrap: wrap; column-gap: .5rem; row-gap: .2rem; justify-content: center; align-items: center; background-color: white; padding: .5rem 1rem .5rem 1rem; }
    #menu .menu-sub a { flex: 0 1 auto; white-space: nowrap; font-size: .9rem; padding: .1rem .5rem .1rem .5rem; border: none; background-color: var(--color-complementary); color: var(--color-text); -webkit-border-radius: 10px; border-radius: 10px; }
    #menu .menu-sub a.active { background-color: var(--color-primary); color: white; text-decoration: none; }

    #menu .lang { display: none; }

    body.no-scroll { overflow: hidden; }

    .basket-list-box { width: 100%; left: 0px; right: auto; }

    #main-content { margin-top: 2rem; }

    .article-text-card.price-dialog { grid-template-columns: 1fr; row-gap: 1rem; column-gap: 0; grid-template-areas:
          "text"
          "price";
    }

    .article-text-card.price-dialog .article-text { background: none; padding: 0; }
    .article-text-card.price-dialog .article-text .title { font-size: 1.5rem; }
    .article-text-card.price-dialog .article-text .perex { display: none; }
    .article-text-card.price-dialog .article-text .more { display: none; }

    .article-price-card .price-variants { padding: 0; border: none; }
    .article-price-card .price-variants .title { font-family: var(--font-family-title); }
    .article-price-card .price-variants .price-variant .amount { width: 2rem; }

    .article-price-card .price-select-weight { padding: 5px; margin-top: 0; }
    .article-price-card .price-select-weight .title { display: block; font-family: var(--font-family-title); padding: 1rem; text-align: center; }
    .article-price-card .price-select-weight .discount-value { font-size: .8rem; }
    .article-price-card .price-select-weight .addToBasket { }
    .article-price-card .price-select-weight .selected-weight .amount { width: 2rem; }
    .article-price-card .price-select-weight .slide-place { }

    .sliderSelectWeight.ui-slider-pips .ui-slider-label { font-size: 10px; }

    .article-price-card .price-variants .description { line-height: 1.2rem; padding: .5rem; }
    .article-price-card .price-select-weight .selected-weight .price-packing-amount-description { line-height: 1.2rem; }

    .section-perex h1 { margin-bottom: .5rem; }
    .section-perex .perex-image { display: none; float: none; margin: 0; }
    .section-perex .perex-image img { width: 100% !important; height: auto !important; }
    .section-perex .perex-text { max-height: 10rem; overflow: hidden; }
    .section-perex .more { display: block; text-decoration: underline; text-align: center; padding-top: .1rem; }
    .section-perex.showAll .perex-text { max-height: max-content; }
    .section-perex.showAll .more { display: none; }

    #filterBox { display: none; }
    .showFilter { display: block; text-decoration: underline; float: right; }
    .section-filter .title { display: block; font-weight: bold; margin-bottom: 1rem; }
    .section-filter .filterBox { width: 100%; margin-bottom: .5rem; }
    .section-filter .filterTitle { font-weight: bold; }
    .section-filter .content { margin: 0 3px 0 3px; }

    .section-perex.blog { margin-bottom: 2rem; }

    .section-content-main.simple-list .alphabet { padding: 1rem 0 1rem 0; }

    .blog-list .blog-card { padding: 0; grid-template-columns: 1fr; grid-template-rows: auto 1fr auto auto; grid-template-areas:
        "img img"        
        "title title"
        "text text"
        "date button"; }
    
    .blog-list { gap: 2rem; }
    .blog-list .blog-card .d { justify-self: start; padding: 0; }
    .blog-list .blog-card .t { margin: 1rem 0 0 0; font-size: 1.5rem; }
    .blog-list .blog-card .r { margin: 0; }

    .article-blog-main-content { padding: 0; }
    .article-blog-main-content h1 { max-width: none; }
    .article-blog-main-content .article-multimedia-card { float: none; margin: 1rem 0 0 0; }
    .article-blog-main-content .article-multimedia-card .multimedia-gallery .article-perex-image img { width: 100% !important; height: auto !important; }
    
    .navigation-path { padding: 0; }

    .article-top-block { padding: 0; margin-bottom: 2rem; column-gap: 0; background-color: transparent; 
                          grid-template-columns: 1fr;
                          grid-template-rows: auto auto auto;
                          grid-template-areas:
                            "nav"
                            "text"
                            "image"
                            "price"; }
    .article-top-block .article-top-header { padding: 0; }
    .article-top-block .article-top-header .title { margin-top: .5rem; }

    .article-multimedia-card .multimedia-gallery .article-perex-image { width: 255px !important; height: 250px !important; }

    .article-price-card .article-price-stock-state { margin: 1rem 0 0 0; padding: 1rem; background-color: var(--color-box-background); -webkit-border-radius: 10px; border-radius: 10px; }

    .article-text .articleText ul { margin-left: 0; padding-left: 1.5rem; }

    .related-articles .blog-list .blog-card { border: none; }

    .article-main-content { padding: 0; grid-template-columns: 1fr; row-gap: 2rem;
                          grid-template-rows: auto auto;
                          grid-template-areas:
                            "text"
                            "info"; }
    .article-main-content .article-text { grid-area: text; grid-column: auto;}
    .article-main-content .article-side-info { grid-area: info; grid-column: auto;}

    .article-about-store { margin: 2rem 0 0 0; padding: 1rem; }
    .article-about-store .aboutStorePicture { float: none; width: 100% !important; height: auto !important; margin: 1rem 0 0 0; }
    
    .related-articles { margin-left: 0; }

    .article-blog-main-content .article-text .contact { display: grid; grid-template-columns: 1fr;
                                                            grid-template-areas:
                                                            "address"
                                                            "map"
                                                            "gallery"
                                                            "about";
                                                            gap: 1rem;
                                                            align-items: center;
                                                            margin-top: 1rem;
                                                        }
    .article-blog-main-content .article-text .contact .box { padding: 0; background: none; }
    .article-blog-main-content .article-text .contact .contact-gallery { gap: 2rem; }

    #emailSubscribeForm { margin: 1.5rem; }
    #socialNetworks { margin: 1.5rem; }

    .fancybox-content { padding: 1rem; }


    #basketNavigation .step .text { font-size: 9pt; }

    .member-profile .address-box { padding: 0; }
    .member-profile .address-box .buttons { text-align: center; }
    .member-profile .address-box .buttons .button { display: inline-block; margin: .5rem auto .5rem auto; text-wrap: nowrap; }

    .member-profile .order-list-header { display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; grid-template-areas:
        "date order"
        "status status"; gap: .5rem; }
    .member-profile .order-list-header .date { grid-area: date; }
    .member-profile .order-list-header .status { grid-area: status; font-weight: normal; font-style: italic; font-size: .9rem; }
    .member-profile .order-list-header .order { grid-area: order; }

    #basketNavigation { margin: .5rem 0px 1rem 0px; }

    #orderCustomer { width: auto; }
    #orderForm { padding: 0;}
    #orderForm h1 { font-size: 1.5rem; }
    #orderForm .basketCustomerDescription { width: auto; }
    #orderForm .basketButtons .button { display: block; float: none; width: auto; margin: auto; padding: .5rem 4rem .5rem 4rem; }
    #orderForm .basketButtons .button.continue { width: 300px; margin: 0 auto 1rem auto; }
    #orderForm .basketButtons .button.confirm { padding: .5rem 2rem .5rem 2rem;  }
    #orderForm .basketButtons .button.confirm .pay { display: block; font-size: .8rem; }
    #orderForm .basketButtons .button.back { width: 170px; margin: 0 auto 1rem auto; padding: .5rem 1rem .5rem 1.5rem;  }

    .basket-list .basket-list-item { grid-template-columns: 55px 40px 1fr auto auto; padding: .5rem 0 .5rem; 
                                     grid-template-rows: auto auto auto;
                                      grid-template-areas:
                                        "image  title       title  title       title"
                                        "image  sales-unit  amount price-unit  price-sum"
                                        "delete sales-unit  amount price-unit  price-sum";
                                   }
    .basket-list .basket-list-item .image { align-self: start; }
    .basket-list .basket-list-item .amount .amountLabel { width: 20px; }
    .basket-list .basket-list-item .sales-unit { align-self: start; justify-self: start; font-size: .9rem; }
    .basket-list .basket-list-item .amount { align-self: start; justify-self: start; font-size: .9rem; }
    .basket-list .basket-list-item .price-unit { align-self: start; font-size: .9rem; }
    .basket-list .basket-list-item .price-sum { align-self: start; font-size: .9rem; }
    .basket-list .basket-list-item .delete a { color: gray; text-decoration: underline; font-size: .7rem; }

    .basket-list .basket-list-item.header { }
    .basket-list .basket-list-item.header .sales-unit { justify-self: center; font-size: .7rem; }
    .basket-list .basket-list-item.header .amount { justify-self: center; font-size: .7rem;  }
    .basket-list .basket-list-item.header .price-unit { justify-self: center; font-size: .7rem; white-space: normal;  }
    .basket-list .basket-list-item.header .price-sum { justify-self: center; font-size: .7rem; white-space: normal;  }
    .basket-list .basket-list-item.header .delete a { }

    .basket-total-sum { padding: 0; }
    .basket-list-vatinfo { padding: 0; }

    .basket-delivery .header { margin-top: 1rem; }

    .basket-delivery .basket-delivery-item {
                                      display: grid;
                                      grid-template-columns: 1fr auto;
                                      grid-template-rows: auto auto;
                                      grid-template-areas:
                                        "title        price"
                                        "description  description";
                                      gap: .5rem;
                                      align-items: center;
                                    }

    .basket-delivery .basket-delivery-item { padding: .5rem 0 .5rem 0; }
    .basket-delivery .basket-delivery-item .image { display: none; }

    .confirmOrderList td { font-size: .8rem; }

    #orderForm #basketTotalSumFreeShipping { padding-left: 0px; }
    #orderForm #basketTotalSumFreeShipping #freeShippingProgressBar { margin-right: 0px; }

    #orderForm #tblOrderTotalSum.tblBasket { float: right; margin: 1rem 0 2rem 0; }
    #orderForm #tblOrderTotalSum.tblBasket .title { font-weight: normal; font-size: 1.2rem; text-align: right; }
    #orderForm #tblOrderTotalSum.tblBasket .totalPrice { font-weight: bold; font-size: 1.2rem; text-align: right; }

}
