:root {
--width-main: 1200px;
--font-icons: 'Material Icons';
--font-primary: 'Titillium Web';
--font-headers: 'Titillium Web';
--font-size-small: 16px;
--font-size-primary: 18px;
--font-size-header-h1: 30px;
--font-size-header-h2: 22px;
--font-size-header-h3: 20px;
--font-weight-400: 400;
--font-weight-500: 500;
--font-weight-600: 600;
--font-weight-700: 700;
--line-height: 1.30;
--line-height-more: 1.50;

        --back-body: #F2F2F2; /* pozadí HTML za eshopem */
        --back-main: #FFF; /* pozadí eshopu, bočního menu */
        --back-info: #627723; /* pozadí infolišty */
        --back-header: #FFF; /* pozadí hlavičky */
        --back-menu: #86B505; /* pozadí horního menu */
        --back-menu-light: #627723; /* 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: #8C8C8C; /* barva pisma světlejší */
        --color-info: #FFF; /* barva písma v infoliště */
        --color-header: #627723; /* 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: #FF0600; /* 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("/soubory/system/bg3.jpg") no-repeat top center;
	}
 @media screen and (max-width: 1200px){
    body {
        background: var(--back-main) !important;
    }
}

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

body {background: #D6F4A6 url("/soubory/system/bg3.jpg") no-repeat top center;}

#header #baner h1 {margin:0; font-weight: var(--font-weight-600);}

#footer {padding: 30px 0 0 0;}
#footer-text {width: 100%;}
#footer-text table td h2, .vypis_item .nazev h2 {font-weight: var(--font-weight-600);}
#max-footer a {color:#d0ffbb;}

#razeni-zobrazeni #razeni a {color: var(--color-header);}

.vyjizdeci_menu li.level_0 a span.menu_text {font-weight: var(--font-weight-600);}

.vypis_item .formkosik .kosikpridej button, .info_ikona_akce, .info_ikona_tip, .info_ikona_novinka {background:#FA7722;}
.vypis_item .hlavni_obrazek_rozmer {border: 5px solid #fa7722; border-radius: 80px 20px;}
.zbozi-wrap .zbozi-obrazky .hlavni_obrazek_rozmer {box-shadow: 0 0 25px rgba(0,0,0,0.15);}

#filtrovani .button.advbutton {background:#FA7722; font-weight: var(--font-weight-600);}

.naseptavac .zbozi a span.nazev {font-size: var(--font-primary)}

.zbozi-wrap .zbozi-obrazky .hlavni_obrazek_rozmer {width:auto;}

#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-weight: var(--font-weight-600);}
#header-phone p {margin: 0; color: var(--color-font-light); font-size: calc(var(--font-size-small) - 2px);}

#menu_login {display:none;}
.zbozi-wrap {grid-template-columns: 40% auto; grid-template-areas: "img top" "img text" "img freespace";}
.zbozi-wrap .popisky-horni {grid-area: text;}
.zbozi-wrap .kratky_popis {grid-area: top;}

.vypsat_vyrobky .popisek .par a {color:var(--color-header);}

@media screen and (max-width: 1200px) {

body {background: var(--back-main) !important;}
#max-header {height:90px;}
#header-phone {position: absolute; right: 20px; height:auto;}
.zbozi-wrap {grid-template-columns: auto; grid-template-areas: "img" "top" "text";}
#respo-menu-wrap {top:130px;}
#max-search {background: #f1f9d9; box-shadow:none;}
.vypis_item .nazev h2 {margin: 2vw 0;}

}

@media screen and (max-width: 600px) {

#max-header {height: 100px;}
#header #baner h1 {line-height: 1.1; font-size: calc(14px + 2vw);}
#header #baner h2 {line-height: 1.5;}
#header-phone {position: relative; right: 0;}
#header-phone:before {font-size: 30px;}
.vypis_item .nazev h2, .vypis_item .formkosik .cena {font-size: var(--font-size-header-h1);}

}