:root {
--width-main: 1200px;
--font-icons: 'Material Icons';
--font-primary: 'Oswald';
--font-headers: 'Oswald';
--font-size-small: 14px;
--font-size-primary: 16px;
--font-size-header-h1: 34px;
--font-size-header-h2: 22px;
--font-size-header-h3: 18px;
--font-weight-400: 400;
--font-weight-500: 500;
--font-weight-600: 600;
--font-weight-700: 700;
--line-height: 1.20;
--line-height-more: 1.50;

        --back-body: #F5F5F5; /* pozadí HTML za eshopem */
        --back-main: #FFF; /* pozadí eshopu, bočního menu */
        --back-info: #947246; /* pozadí infolišty */
        --back-header: #FFF; /* pozadí hlavičky */
        --back-menu: #6B4D28; /* pozadí horního menu */
        --back-menu-light: #947246; /* světlejší pozadí horního menu */
        --line-color: #0000001a; /* barva čar a oddělovátek */
        --border-input: #00000033; /* barva ohraničení imputů */

        --color-font: #000; /* barva pisma */
        --color-font-light: #707070; /* barva pisma světlejší */
        --color-info: #FFF; /* barva písma v infoliště */
        --color-header: #6B4D28; /* barva písma v hlavičce */
        --color-menu: #FFF; /* barva písma v horním menu */
        --color-other: #C0C0C0; /* doplňková barva */
        --color-system-alert: #D85A53; /* barva upozornění */
        }
@media screen and (max-width: 1200px) {
	:root {
	--font-size-small: calc(5px + 2vw);
	--font-size-primary: calc(6px + 2vw);
	--font-size-header-h1: calc(12px + 2vw);
	--font-size-header-h2: calc(8px + 2vw);
	--font-size-header-h3: calc(6px + 2vw);
	--line-height: 1.20;
	--line-height-more: 1.60;
	}
}
body  {
    background: var(--back-body) url("bg.jpg") no-repeat top center;
	}
 @media screen and (max-width: 1200px){
    body {
        background: var(--back-main) !important;
    }
}

/* ///////////////////////// */
/*  nasleduje vlastni CSS    */

:root {--font-primary: 'Barlow'; --font-headers: 'Barlow';}

body {background: linear-gradient(to bottom right, #f8efe3, #d1c0a9);}

a {color:#ff9900;}

#max-menu {display:none;}

#header #baner h2 {font-size: var(--font-size-header-h1); font-weight: var(--font-weight-600);}
#header #max-search .button {font-weight: 600;}

#header-phone {height: 50px; display:flex; flex-flow:row;}
#header-phone:before {align-items: center; display: flex; font-family: var(--font-icons); content: "\e0b0"; color: var(--color-font-light); font-size: 40px; padding-right: 10px;}
#header-phone .header-phone-inner {display:flex; flex-flow:column;}
#header-phone h3 {margin: 0; font-size: var(--font-size-header-h2); font-weight: var(--font-weight-600);}
#header-phone p {margin: 0; color: var(--color-font-light); font-size: calc(var(--font-size-small) + 2px);}

#content-left h2, #content-right h2 {background: #947246 url(userFiles/system/pismeno-small.png) right no-repeat; border: 2px solid #6b4d28; color: white; text-shadow: 2px 2px rgba(0,0,0,0.2); font-weight:600; font-size: calc(var(--font-size-header-h3) + 2px);}
#content-right > div h3 {font-size: calc(var(--font-size-header-h3) - 1px); font-weight: var(--font-weight-500); padding: 5px 10px; margin:0;}
#content-right > div h3 a {font-size: calc(var(--font-size-header-h3) - 1px); font-weight: var(--font-weight-500);}
#content-right .nahledy-krbu img {margin:5px 0 !important;}

#cssmenu .sub-text .menu-text, #respo-menu .sub-text .menu-text {font-size: calc(var(--font-size-header-h3) - 1px);}

#content-center .uvodni-rozcestnik {display: block;}
#content-center .uvodni-rozcestnik > div {display: inline-block; width: calc(20% - 8px); border: 2px solid rgba(0,0,0,0.05); height: 130px;}
#content-center .uvodni-rozcestnik div img {margin:0 auto;}

.vypis_item .nazev h2 {margin: 1vw 0; font-weight: 700; color: #684d29; line-height: 1.1;}

#footer-text {width:1200px;}
#footer-text .tabulka {width:100%;}

@media screen and (max-width: 1200px) {

#max-header {height:90px; margin-top:40px;}
#header-phone {height:auto; margin-right: 20px;}
#respo-menu-wrap {top: 135px;}
#max-search {width:auto;}

#footer-text {width:100%;}

#content img {max-width:100%;}

}

@media screen and (max-width: 600px) {

#header #baner {display:none;}
#header-phone:before {font-size: 26px; padding-right: 8px;}
#header .hlavicka_logo img {height: 66px; max-width: none; max-height: none;}

#cssmenu .sub-text .menu-text, #respo-menu .sub-text .menu-text {font-size: calc(var(--font-size-header-h3) + 3px);}

#content-center .uvodni-rozcestnik > div {width: calc(33% - 8px);}
#content-center .uvodni-rozcestnik div img {height: 90%;}

}