/*========= obecně písma a prvotní vzhled ==============================================*/

html {font-size: 15px; background: #fff; }
body {font-family: 'Arial', sans-serif; color:#222; }
input,select,textarea,button {font-family: 'Arial',sans-serif;font-size: 1rem;box-sizing:border-box;}

/*========= obecné =====================================================================*/
body { margin:0; background: url(/img/bg_photo.jpg) center top no-repeat #76a010; }
#container { min-height: 100%; }
img {max-width: 100%;}
a img {border:0;text-decoration: none;}
a {text-decoration: underline;}

h1 {text-transform: uppercase; font-size: 24px;}
h2 { margin-bottom: .6em;text-transform: uppercase; font-size: 19px;}
h2.nomarginb {margin-bottom: 0;}
h3 {}
h2 a { text-decoration: none; }
h3 a { text-decoration: none; }
h4 a { text-decoration: none; }

ul{ padding: 0 0 0 2em; overflow: hidden; }
ul li{ padding:0; margin-bottom: .5em;}
blockquote { background: #eee; border: 1px solid #ddd; margin: 0 0 1.5em; padding: .25em 1em;}
blockquote p { font-size: 1.2em; margin: .5em;}
hr { width: 100%; height: 1px; margin:.75em 0;  }

table {max-width:100%; border-collapse: collapse; }
table td,table th { padding-right: 1em; }
table.ramovana { border: 1px solid;}
table.ramovana td,table.ramovana th { border: 1px solid; padding-left: .5em; padding-right: .5em; }

template {display:none;}

/*========= globální třídy a modifikátory ==============================================*/
/* Případně doplněny s konkrétními identifikátory podstránek a sekcí */
.hid {display: none!important;}

.chyba,.msgOk {padding: .5em 1em .5em; border: 2px solid;margin-bottom: 2em;}
.chyba {font-size: 1.2em; background: #fdd; color:#d00; font-weight: bold; border-color: #eaa; }
.msgOk {background: #dfd; color:#242; border-color: #aea; }
.chyba p,.msgOk p {margin-bottom: .5em!important; margin-top: .5em!important; }

.left {float:left!important;}
.right {float:right!important;}
.cleaner {display: block; width: 100%; clear: both!important;}

.nalevo {text-align: left!important;}
.nastred {text-align: center!important;}
.napravo {text-align: right!important;}
.navse {text-align: justify!important;}

.tucny  { font-weight: bold;}
.italika { font-style: italic }
.podtrzeny { text-decoration: underline!important; }
.preskrtnute {text-decoration: line-through!important; }

.mensi-pismo { font-size: .8em; }
.vetsi-pismo { font-size: 1.25em;  }
.velke-pismo { font-size: 1.5em;  }
.pismo2x { font-size: 2em; }

.kurzor-sipka { cursor: default; }
.kurzor-otaznik { cursor: help; }
.kurzor-ruka { cursor: pointer; }

.transparent { -moz-opacity:.5; opacity:.5; }
.full {width: 100%;}
.oneline {white-space: nowrap;}

.resptabwrap { max-width: 100%; overflow-x: auto; }

.topMsg {background: #ecc; color:#f33; font-weight: bold; font-size: 1.1em; padding: .25em 10%; text-align: center;}
form .post {display: none!important;}
form .bblcntnr {}
form .bblcntnr .bubble { display: block; text-align: left; }
form .bblcntnr .bubble span { border:1px solid #eaa; background: #fdd; color:#d00; font-weight: bold; display: inline-block; padding: .1em .5em;margin: .1em; }
form .js_error_list { opacity:1; display: block; text-align: left; border:1px solid #eaa; background: #fdd; color:#d00; font-weight: bold; padding: .1em .5em;margin: .1em;}
form .js_error_list:empty { display: none;}
@keyframes fadeOut {  from { opacity: 1; }  to { opacity: .25; } } form .js_error_list.diss {opacity: .25; animation: fadeOut 10s}

.max-sirka {width: 100%; max-width: 1100px; margin:auto;position: relative;}

.tlacitko {color:#fff; background:var(--mainbarva); border: 0; font-size: 13px; padding: .85em 1em; line-height: 1em; font-weight: bold; text-decoration: none; text-transform: uppercase; cursor: pointer; display: inline-block; border-radius: 2px;}
button.tlacitko,input[type=submit].tlacitko {}
.tlacitko:hover {}
button.tlacitko:hover,input[type=submit].tlacitko:hover {}

:root {--wastemenu-color: #000; --wastemenu-xcolor: #000; --wastemenu-lwidth: 9%; --wastemenu-border: 9%; }
span.wasteofspace{  height: 2rem; min-width: 2rem; font-size: 0; display: inline-block; vertical-align: middle; overflow: hidden; padding: 0;
   background: linear-gradient(to bottom, 
         transparent 0% var(--wastemenu-border), 
         var(--wastemenu-color) var(--wastemenu-border) calc( var(--wastemenu-border) + var(--wastemenu-lwidth) ), 
         transparent calc( var(--wastemenu-border) + var(--wastemenu-lwidth) ) calc( 50% - var(--wastemenu-lwidth) / 2 ), 
         var(--wastemenu-color) calc( 50% - var(--wastemenu-lwidth) / 2 ) calc( 50% + var(--wastemenu-lwidth) / 2 ), 
         transparent calc( 50% + var(--wastemenu-lwidth) / 2 ) calc( 100% - var(--wastemenu-border) - var(--wastemenu-lwidth) ), 
         var(--wastemenu-color) calc( 100% - var(--wastemenu-border) - var(--wastemenu-lwidth) ) calc( 100% - var(--wastemenu-border) ), 
         transparent calc( 100% - var(--wastemenu-border) ) 100% 
      );
}
span.wasteofspace.waste-x {
   background: linear-gradient(45deg, 
         transparent 0% calc( 50% - var(--wastemenu-lwidth) / 2 ), 
         var(--wastemenu-xcolor) calc( 50% - var(--wastemenu-lwidth) / 2 ) calc( 50% + var(--wastemenu-lwidth) / 2 ), 
         transparent calc( 50% + var(--wastemenu-lwidth) / 2 ) 100%
      ), linear-gradient(-45deg, 
         transparent 0% calc( 50% - var(--wastemenu-lwidth) / 2 ), 
         var(--wastemenu-xcolor) calc( 50% - var(--wastemenu-lwidth) / 2 ) calc( 50% + var(--wastemenu-lwidth) / 2 ), 
         transparent calc( 50% + var(--wastemenu-lwidth) / 2 ) 100%
      );
}

details {margin:1em 0; border: 1px solid #ddd; padding: 0 1em; }
details summary {cursor: pointer; padding: 1em 0; }
details[open] { padding-bottom: 1em;}
details[open] summary {border-bottom: 1px solid #ddd; padding-bottom: 1em; margin-bottom: 1em; }
details summary > * {display: inline;}

/*========= společné definice (barvy, chování apod.) ===================================*/
:root {--mainbarva:#76a010; --secbarva:#3464a3; }
h1:first-letter,h2:first-letter,h3:first-letter,p.h2:first-letter,p.h3:first-letter {text-transform: uppercase}
a,.mainbarva { color:#82a731; }
h1,h2 { color:var(--secbarva); }
#naseptavac .naseppolozka:focus { background: var(--secbarva);}
.gbg {background: #f3f3f3;}
.mainbg {background: #6a900e; color:#fff;}
.mainbg a {color:#fff;}

.hoverline,.nohoverline,.hoverparent {text-decoration: none;}
.hoverline:hover,.hoverbase:hover .hoverparent {text-decoration: underline;}

/*========= prvky hlavičky =============================================================*/
#hlavickabg { padding: 2em 0 1em; }
#hlavicka {display: grid; row-gap: 1.5em; column-gap: 3%; align-items: center; grid-template: auto auto / 210px 1fr minmax(200px, 1fr); grid-template-areas: 
              'logo . hledej'
              'logo . login';
}
#hlogo { display: block; grid-area: logo; }
#login { grid-area: login; }
#hledatObal { grid-area: hledej; }
#xhmenu { grid-area: xmenu; }

#hpruh { background:url(/img/pruh.png) repeat-x; background-size: 1px 100%; overflow: hidden; border-radius: 3px; margin-top: 2em; display: grid; grid-template: auto / auto 1fr; }
#hbottom { font-size: 14px; justify-self: right; text-align: right;}
#hbottom p {display: inline-block; vertical-align: middle; line-height: 60px; white-space: nowrap; color:#fff; padding: 0 25px 0 50px; background: left center no-repeat; margin: 0; font-size: 17px;}
#hbottom p a { color:#fff; text-decoration: none }
#hbottom p a:hover { text-decoration: underline; }
#hbottom p.mail { background-image: url(/img/ic_mail.png);}
#hbottom p.tel { background-image: url(/img/ic_phone.png);}

/*========= přihlašování ===============================================================*/
#login {position: relative; line-height: 1.25em; white-space: nowrap; text-align: right; font-weight: bold; }
#login.logout {}
#login .delic {display: inline-block; padding: 0 .66em;}
#login .uzivatel { color:var(--secbarva);}
#login .uzivatel2 {color:var(--secbarva);}
#login form { position: absolute; top: 100%; right: 0; width: 300px; padding: 1em;text-align: left; border:1px solid #eee; background: #fff; z-index: 200; font-weight: normal; }
#login form .pwrap { width: 60%; float:left; }
#login form p { margin: .25em 0; }
#login form label { width: 40%; margin-right: 1%; display: inline-block; vertical-align: middle; text-align: right; }
#login form input { width: 59%; display: inline-block; vertical-align: middle; }
#login form button { width: 35%; float:right; margin: .75em 0 0; display: block; }
#login form > p { margin-bottom: 0; }
#login form > p label{ width: 24%; }

/*========= menu =======================================================================*/
.hmenu { font-size: 16px; font-weight: bold; float: left;}
.hmenu a {text-decoration: none; display: table; width: 100%; color:#fff;}
.hmenu .radic { display: inline-block; vertical-align: middle; position: relative; }
.hmenu .msp { display: table-cell; vertical-align: middle; padding: 0 1.9em; line-height: 1.2em; height: 60px;}
.hmenu .radic:hover .msp,
.hmenu .active .msp{ background: url(/img/menu-hover.png) repeat-x; background-size: 1px 100%; color: #3464a3; }
.hmenu .oddelovac {width: 1px; height: 60px; background: rgba(255,255,255,.5);}

#xhmenu {z-index: 1000; }
#xhmenu a {color:var(--secbarva);}
#xhmenu .extrawrap {display: block; background: rgba(255,255,255,.95); position: fixed; top:0; padding: 1em 18% 14em; left:0; width: 100vw; bottom: 0; overflow: auto; z-index: 999; box-sizing: border-box;}
#xhmenu .radic{ display: block; text-align: left; z-index: 1000;}
#xhmenu .msp { padding:1em 0; height: auto;}
#xhmenu .radic:hover .podmenu, #xhmenu .podmenu.shown { display: none; }
#xhmenu .overline { border-top: 1px solid #ddd; padding: .5em 0; }

/*========= jazyky =====================================================================*/
#vlajky { text-align: right;}
#vlajky a {margin-left: 1em; text-transform: uppercase;}

#xvlajky {border-top:1px solid #ddd; display: block; margin-bottom: 1em;text-align: center; text-transform: uppercase; }
#xvlajky a {display: inline-block; width: auto; margin: 0 1em; padding: 1em 0; }

/*========= vyhledávání ================================================================*/
#hledatObal {min-width: 200px; position: relative; }
#hledatObal form {border: 1px solid #b6c7d7; border-radius: 3px; box-shadow: inset 0 2px #f2f2f2; background: #fff; }
#hledatObal .q{ width: 79%; margin:0; margin-left: 3%; border:0; padding: 0; height: 38px; background: transparent; color:#405165; vertical-align: middle; }
#hledatObal .q::placeholder { font-style: italic; opacity: 1; }
#hledatObal .tlacitko { width: 15%; height: 38px; margin:0; padding: 0; margin-right: 3%;vertical-align: middle; background: url(/img/ic_search.png) center center no-repeat transparent; font-size: 0; }

#naseptavac {width: 100%; border: 1px solid #f3f3f3; background: #fff; height: 16.5em; z-index: 700; position: absolute; left: 0; top: 100%; }
#naseptavac .naseppolozka { display: block; background: #fff; }
#naseptavac .naseppolozka span { overflow: hidden; display: block; padding: 0 4%; height: 1.5em; line-height: 1.5em; }
#naseptavac .naseppolozka:focus { color:#fff; }
#nasepfoto {position: absolute; right: 100%; top:-1px; background: #fff; border: 1px solid #f3f3f3; width: 220px; height: 16.5em; text-align: center; }
#nasepfoto a {display: block; padding: .5em 5%; height: 100%;}
#nasepfoto .nadpis {display: block; line-height: 1.4em; height: 2.8em; overflow: hidden; }
#nasepfoto .fotoInside {display: block; height: 12.7em; line-height: 12.7em; white-space: nowrap; }
#nasepfoto .fotoInside img{vertical-align: middle; max-height: 100%; }

/*========= prvky stránky ==============================================================*/
#strankabg {padding: 1em 0 1.5em; }
#stranka { display: grid; grid-template: auto 1fr / 1fr 70%; column-gap: 3%; grid-template-areas: 
              'kategorie telo'
              'sloupecL telo'; 
}
#katdiv { grid-area: kategorie; }
#telo {grid-area: telo;}
#sloupec-levy { grid-area: sloupecL; }
#rzabal {grid-area: telo;}

/*========= obsah ======================================================================*/
.telo {padding: 0; margin:0 0 2em; background: #fff; border-radius: 2px; clear:right; padding: 1em 3.6%;}

.obsah { line-height: 1.66em; position: relative; }
.obsah p { margin-top: 0; margin-bottom: 1.33em;}
.obsah img.left,.obsah iframe.left,.obsah div.left {margin: .75em 1em; margin-left: 0;}
.obsah img.right,.obsah iframe.right,.obsah div.right {margin: .75em 1em; margin-right: 0;}
.obsah iframe {max-width: 100%;}

.obsah div.left,.obsah div.right, .obsah div.full {text-align: center; padding:1em;}
.obsah div.full{ margin: .75em 0;}
.obsah div.left > :last-child,.obsah div.right > :last-child,.obsah div.full > :last-child {margin-bottom:0; }

.anotacka { font-size: 1.33em; }

/*========= drobečková =================================================================*/
.drobnav {line-height: 1.75em; font-size: .8em; color:#888; margin: 1em 0; }
.drobnav a {color:#888;}
.drobnav span { padding:0; margin:0; display: inline-block;}
.drobnav span.odd {margin: 0 .75em;}

/*========= podstránky =================================================================*/
:root { --podkat_sloupce:3; --podkat_mezery:calc( var(--podkat_sloupce) - 1 ); --podkat_sloupce_mezera:3%;}
.podkat {width: 100%; margin-top: 1em; display: flex; flex-wrap: wrap; column-gap: var(--podkat_sloupce_mezera); row-gap: 1em; margin: 1em 0; }
.podkat a {font-size: 1.1em;align-items: stretch; border: 1px solid #eee; padding: .33em 1%; position: relative; box-sizing: border-box;
   flex: 0 0 calc( calc( 100% - calc( var(--podkat_mezery) * var(--podkat_sloupce_mezera) ) ) / var(--podkat_sloupce) );}
.podkat a:hover {border: 1px solid #ccc; }
.podkat.sfoto a { min-height: 125px; }
.podkat.sfoto .pic { display: block; height: 100px; line-height: 100px; width: auto; max-width: 100%; white-space: nowrap; text-align: right; }
.podkat.sfoto img {vertical-align: middle;}

/*========= fotky ======================================================================*/
.gallery {width: 100%; margin-top: 1em;}
.gallery .box {width: 25%; display: inline-block; text-align: center; vertical-align: top; margin: .75em 0;}
.uvodni .gallery .box {width: 33%; }
.gallery .box a {display: block; white-space: nowrap; line-height: 150px;}
.gallery .box img {vertical-align: middle; }
.gallery img { padding:2%; border: 1px solid #fafafa; box-sizing: border-box; }
.gallery .text { display: block; padding: 0 2%; margin-top: .1em; }

/*========= soubory ====================================================================*/
.files {display:table; max-width: 700px; width: 100%; margin-top: 1em;}
.files a {display: table-row; text-decoration: none}
.files span {display:table-cell; vertical-align: middle; text-align: left; padding: .5em 0; border-bottom: 1px solid #eee;}
.files img {float:left; margin: 0 .5em;}
.files .tail {text-align: right;}

/*========= články =====================================================================*/
.clanky {}
.clanky .clanek { margin-bottom: 2em; }
.clanky .h3 { font-weight: bold; font-size: 1.1em; margin-bottom: 0;}
.clanky .datum {font-size: .9em; color:#777; margin: 0 0 .5em;}

/*========= novinky ====================================================================*/
.novinky {}
.novinky .novinka {margin-bottom: 2em;}
.novinky .h3 {font-weight: bold; font-size: 1.1em; margin-bottom: 0;}
.novinky .datum {font-size: .9em; color:#777; margin: .5em 0 .75em;}

/*========= sloupce ====================================================================*/
#katdiv { font-size: 16px; line-height: 1.5em; color:#fff; font-weight: bold;background: rgba(137,182,27,.74); border-radius: 2px; margin-bottom: 2em; }
#katdiv .menunadpis { font-size: 19px; text-transform: uppercase; padding: .95em 1em; }
:root {--menu-arrow-w:2.5em;}
.katmenu { list-style-type: none; padding:0; margin: 0; }
/* 1. úroveň */
.katmenu li { margin:0; border-top: 1px solid rgba(0,0,0,.13);}
.katmenu li a { display: block;}
.katmenu li > a > span {display: inline-block; vertical-align: middle; padding:.5em; box-sizing: border-box; }
.katmenu li .rozklik {width: var(--menu-arrow-w); height: 2em; cursor: pointer; text-align: center; background: center center no-repeat url(/img/ic_arrow.png); padding-right: 0;}
.katmenu li.open .rozklik {background-image: url(/img/ic_arrow_down.png);}
.katmenu li.empty .rozklik {background: none;}
.katmenu li .katlink {width: calc(100% - var(--menu-arrow-w)); text-decoration: none; color: #fff; padding-left: 0; }
.katmenu li:hover > a,
.katmenu li.active > a { background: url(/img/vmenu-hover.png) repeat-x; background-size: 1px 100%; }
.katmenu li:hover > a >.katlink,
.katmenu li.active > a > .katlink { color:#76a010; }
/*2. úroveň - rozdíly prvků od 1. úrovně */
.katmenu li ul {display: none;list-style-type: none; padding:0; margin: 0; font-size: 14px;}
.katmenu li.open ul {display: block;}
.katmenu li ul li.active { background: url(/img/vmenu-hover.png) repeat-x; background-size: 1px 100%; }
.katmenu li ul li .rozklik { width: calc(1.5 * var(--menu-arrow-w)); background: none!important; }
.katmenu li ul li .katlink {width: calc(100% - calc(1.5 * var(--menu-arrow-w)));}

#xkat .katlink {color:#76a010; }
#xkat .katmenu li > a > span {padding-top: 1em; padding-bottom: 1em; }

#sloupec-levy {}

.sl-box { margin-bottom: 2em; color:#fff;}
.sl-box p {}
.sl-box p.h2 { font-weight: bold; text-transform: uppercase; font-size: 19px; }

.sl-box.novy {border:1px solid #9fbd58; border-radius: 2px; padding: 20px 6% 40px; font-size: 13px; line-height:1.5em; }
.sl-box.novy .polozka{ margin: .75em 0; }
.sl-box.novy p{ margin: 0 0 1.33em; }
.sl-box.novy p.datum{ color:#222; }
.sl-box.novy .link { display: block;  margin: 0 0 .5em; color: #fff; }

.sl-box.nltr { background:#6a900e; padding: 6%; border-radius: 2px; }
.sl-box.nltr p.h2 {margin: 0 0 .5em;}

/*========= šablony ====================================================================*/
.respgbg,.respgbg tbody {width: 100%; border-collapse: collapse;}
.respgbg tr td:first-of-type {background:#f3f3f3;}
.respgbg tr td {border-bottom: 1px solid #eee;border-top: 1px solid #eee; padding: 0 .5em;}

.flexcols {display: flex; width:100%; flex-wrap: wrap; justify-content: space-around; align-items: flex-start; }
.flexcols.verticentr {align-items: center;}
.flexcols > div {padding: .5em; box-sizing: border-box; margin-bottom: 1em; }
.flexcols > div > p:last-child {margin-bottom: 0;}
.column2 > div {width: 50%; }
.column3 > div {width: 33.3%; }
.column4 > div {width: 25%; }
.column5 > div {width: 20%; }

/*========= slider =====================================================================*/
#slider1, .slider1, .slider1 .vnitrek .content {max-height: 300px; overflow: hidden;}
.slider1 .vnitrek .content {height:auto; padding-top: 300px; position: relative; }

.slider1 { position: relative; margin-bottom: 2em; float:right; width: 100%; background: url(/img/slider_box.png) repeat-x; background-size: 1px 100%; }
#slider1 { overflow: hidden; }

.slider1 .bx-prev,.slider1 .bx-next {position: absolute; bottom: 2em; }
.slider1 .bx-prev {right: 4em;}
.slider1 .bx-next {right: 2em;}

.slider1 .vnitrek {position: relative;overflow: hidden}
.slider1 .vnitrek .content {display: block; text-align: center; }
.slider1 .vnitrek .img {width: 100%; /*left:50%;*/ text-align: right; position: absolute; right: 0; top:50%; /*bottom:0; top:0;*/ }
.slider1 .vnitrek .img img {position: relative; /*left:-50%;*/
                            -webkit-transform:translateY(-50%);
                            -moz-transform:translateY(-50%);
                            -ms-transform:translateY(-50%);
                            transform: translateY(-50%);
}
.slider1 .text {position: absolute; display: block; top:50px; left: 5.3%; height: 140px; line-height: 35px; max-width:350px; text-transform: uppercase; font-weight: bold; color: #3464a3; font-size: 34px; text-align: left; }
.slider1 .text2 {display: block; color: #80a144; font-weight: normal; font-size: 24px; }
.slider1 .tlacitko {background:#3b6eab; position: absolute; bottom: 3em; left: 5.3%; }

/*========= kontaktní formulář =========================================================*/
.kform { text-align: left; color:#fff;display: inline-block; vertical-align: top; }
.kform form { }
.kform p {margin: 0 0 1em; }
.kform .sloup {display: inline-block; vertical-align: top; width: 48%; }
.kform .l { padding-right: 2%; }
.kform .r { padding-left: 2%; }
.kform label {display: block; line-height: 1.5em; padding: 0;}
.kform label.readerhelp {width: 0; height: 0; overflow: hidden; display: block; }
.kform .stretch {width: 100%;box-sizing: border-box; padding: 0 .5em; border:0; color: #fff; height:35px; background: #597513; box-shadow: inset 0 2px #506911; border-radius: 3px;}
.kform textarea.stretch { padding: 10px .5em; height: 80px;}
.kform .tlacitko {}
.kform ::placeholder { font-style: italic; color:#777; opacity: 1;}
#telo .kform {padding-top: .5em;}

/*========= formulář newsletteru =======================================================*/
.nwform { text-align: left; width: 100%;}
.nwform form { }
.nwform form .fbg { border-radius: 3px; background: #597513; box-shadow: inset 0 2px #506911; }
.nwform p {margin: 0 0 .5em; }
.nwform label {display: block; line-height: 1.5em;}
.nwform label.readerhelp {width: 0; height: 0; overflow: hidden; display: block; }
.nwform .stretch {width: 80%;box-sizing: border-box; padding: .5em; color:#fff; background: transparent; height:40px; margin-left: 3%; border:0; display: inline-block; vertical-align: middle; }
.nwform .tlacitko { background: url(/img/ic_send.png) center center no-repeat transparent; width: 14%; padding: 0; height:40px; margin-right: 3%; font-size: 0;display: inline-block; vertical-align: middle; }
.nwform .plnSed { font-style: italic; }
.nwform ::placeholder { font-style: italic; color:#777; opacity: 1;}

/*========= formuláře obecně ===========================================================*/
.simpleform {width: 100%; }
.simpleform.zkform {max-width: none; }
.simpleform p {margin: .5em 0;}
.simpleform p.field {margin: .25em 0; padding: .25em 0; display: grid; grid-template: auto / 35% 1fr; align-items: baseline; column-gap: .75em; }
.simpleform.labelabove p.field { grid-template: 1fr auto / 1fr; margin-bottom: 1em; }
.simpleform:not(.labelabove) p.field:not(:last-child) {border-bottom: 1px solid #eee; }
.simpleform.zkform p {margin: 1em 0; }
.simpleform p.field > label {display:block;}
.simpleform p.field .stretch {display: block; padding: .25em .5em; width: 100%; box-sizing: border-box; }
.simpleform p.field textarea.stretch {height: 5em; vertical-align: top; resize: vertical; }
.simpleform p.field span.stretch { padding: .25em 0; }
.simpleform p.field input[type=checkbox] { justify-self: left; }
.simpleform p .tlacitko {vertical-align: middle; }
.simpleform fieldset {border: 1px solid #777; margin: 1em 0;}
.simpleform details {border-color:#777;}
.simpleform details fieldset {border:0;}

.form-fill-notice { font-weight: bold; background: #cc222225; padding: .75em; }

/*========= registrace =================================================================*/
.regform .cb label {width: auto;}

:root {--zaknav-sloupce: 3; --zaknav-mezery: calc( var(--zaknav-sloupce) - 1 ); --zaknav-sirka: calc( calc( 100% - calc( var(--zaknav-mezery) * 1em ) ) / var(--zaknav-sloupce) )}
:root {--cblist-sloupce: 3; --cblist-mezery: calc( var(--cblist-sloupce) - 1 ); --cblist-sirka: calc( calc( 100% - calc( var(--cblist-mezery) * 1em ) ) / var(--cblist-sloupce) )}
#zaknav {display: flex; flex-wrap: wrap; row-gap: 1em; column-gap: 1em; align-items: stretch; margin-bottom: 2em;}
#zaknav a { border:1px solid var(--mainbarva); box-sizing: border-box; padding: .75em; align-content: center; flex: 0 0 var(--zaknav-sirka); display: block; text-decoration: none; font-weight: bold; }

.simpleform .cblist {display: flex; flex-wrap: wrap; row-gap: .5em; column-gap: 1em; align-items: stretch; margin: 0; border:1px solid #eee; }
.simpleform .cblist .cbbox { box-sizing: border-box; align-content: center; flex: 0 0 var(--cblist-sirka); display: block; text-decoration: none; font-weight: bold; }

.simpleform p .flexer {display: block; row-gap: .5em; column-gap: 1em; display: flex; flex-wrap: wrap;  }
.simpleform p .flexer .cblbl { flex: 0 0 100%; box-sizing: border-box; }
.simpleform p .flexer .cblbl span { display: inline-block; vertical-align: middle; line-height: 1.1; }
.simpleform p .flexer .cblbl input { display: inline-block; vertical-align: top; }
.simpleform p .disabled { text-decoration: line-through; color:#999; }

/*========= zkoušky a termíny ==========================================================*/
#zklist {  }
#zklist .zk { margin: 2em 0; padding: 1em; background: #e9e3e3; border-radius: 5px; display: grid; grid-template: 1fr auto auto auto auto / 1fr auto; row-gap: .5em; column-gap: 1em; align-items: center; 
     grid-template-areas: 'nadpis nadpis' 'status tform' 'mezi mezi' 'formplace formplace' 'detail detail'
}
#zklist h2 { grid-area: nadpis; margin: 0; } 
#zklist .status { grid-area: status; margin: .5em 0 0; color:#555; } 
#zklist .about {grid-area: tmore; }
#zklist .meziclanek { grid-area: mezi; margin-bottom: -1em; }
#zklist .meziclanek.msgOk { margin-bottom: 1em; }
#zklist .statusbtn {grid-area: tform; }
#zklist .sumtarget {grid-area: formplace; }
#zklist .sumfor::after { content: '▼'; margin-left: 1em; }
#zklist .sumfor.open::after { content: '▲'; }
#zklist .termpick { display: block; }
#zklist .termpick.cut { text-decoration: line-through; }
#zklist .zkdetail { grid-area: detail; }

#zkplist {  }
#zkplist .zk { margin: 2em 0; padding: 1em; background: #e9e3e3; border-radius: 5px; }
#zkplist .links { display: grid; grid-template: auto auto / 1fr 2fr; column-gap: 1em }
#zkplist .links a { border:1px solid var(--mainbarva); box-sizing: border-box; padding: .5em; align-content: center; display: block; text-decoration: none; }
#zkplist .proto { padding: .25em 1em; border: 1px solid rgba(0,0,0,.5); }
#zkplist .proto h3 { margin-top: .33em; }

/*========= prvky patičky ==============================================================*/
#patickabg {padding:2.5em 0 4em;background: #6e9216;color: #283509;  }
#paticka { display: grid; column-gap: 3%; row-gap: 1em; grid-template: auto / 1fr 53%; grid-template-areas: 'sl1 sl2'; }
#paticka .spkontakt { color: #283509; font-size: 16px; line-height: 25px; grid-area: sl1; }
#paticka .spkontakt p { margin:0 0 10px; }
#paticka a { color:#fff;}
#paticka h2 { color: #fff; font-size: 24px; margin: 0 0 1em;}

#zakoncenibg {margin: 1em 3.5% 0; padding-top: 2em; position: relative; font-size:13px;color: #3e530c; border-top: 1px dotted #3e530c;}
#zakoncenibg a { color: #3e530c; }

/*========= pro výměnu odkazů ==========================================================*/
.xch p {border-bottom: 1px solid #ddd; margin: 0; padding: .5em; width: auto;}
#xchlink {}

/*========= ostatní zbytečnosti ========================================================*/
@media (min-width: 689px){
   #cm.cloud {max-width: 800px; padding: 2em; }
   .cc_div .cloud #c-inr {display: flex;}
   .cc_div .cloud #c-inr-i {width: auto; flex-shrink: 1;}
   .cc_div .cloud #c-bns {max-width: 225px; width: 40%; font-size: 1.25em; text-align: center; }
   #cm.cloud #c-bns button + button.c-bn {display: inline-block; font-size: .82em; margin: 1.5em auto; float:none; padding: 0; background: #fff; width: auto; }
   #cm.cloud #c-bns button + button:hover {text-decoration: underline; cursor:pointer; }
}
@media (max-width: 689px){
   .cc_div .cloud #c-bns {display: flex; flex-direction:row; justify-content: space-between;}
   #cm.cloud .c-bn {width:auto; box-sizing: border-box;margin: 0; display: block; flex-basis: 45%; }
   #cm.cloud .c-bn:first-child {margin: 0; order:2}
   #cm.cloud #c-bns button + button.c-bn { background: #fff; order: 1; }
   #cm.cloud #c-bns button + button:hover {text-decoration: underline; cursor:pointer; }
}
:root {--cc-btn-primary-bg:var(--mainbarva); --cc-btn-secondary-hover-bg:#fff; }

.babish { text-align: left;}

#modalbase {position: fixed; top:0; left:0; width: 100vw; bottom: 0; background: rgba(0,0,0,.6); z-index: 10000; }
#modaldialog {background: #fff; padding: 1.5em; box-sizing: border-box; position: absolute; width: 80vw; left: 0; right: 0; text-align: center; max-width: 500px;margin-left: auto; margin-right: auto; overflow:auto; }
#modaldialog .dialogclose {position: absolute; display: block; color:transparent; background: url(/img/ikona-smaz.png) center center no-repeat; right:0; top:0; width: 1.5em; height: 1.5em; }
#modaldialog .tlacitko { margin: 0 1.5em 1em;pointer-events: auto; }

/*========= responzivity ===============================================================*/

@media (max-width:1149px) { /* max-sirka + 50px */
   .max-sirka {width: 94%; margin: auto 3%;}
}


@media (max-width:999px) {
   #zklist .zk { grid-template: auto 1fr auto auto auto / auto 1fr; justify-items: start;
     grid-template-areas: 'nadpis nadpis' 'status status' 'tform tmore' 'mezi mezi' 'detail detail'
   }
}

@media (max-width:749px) {
   .hmenu .hider { display:none!important; }
}

@media (min-width:750px) {
   #xhmenu {display:none;}
   .hmenu .shower {display:none!important;}
   
}

@media (max-width:799px) {
   :root { --podkat_sloupce:2; }
   .uvodni .gallery .box,.gallery .box {width: 50%; }
}

@media (max-width:749px) {
   #hlavickabg {padding: 20px 0 10px; }
   #hlavicka { padding-bottom: 20px; border-bottom: 5px solid #2a5595; grid-template: auto / 150px 1fr auto 50px; grid-template-areas: 
              'logo . hledej xmenu'; }
   #login {display: none;}
   #hpruh {display: none;}
   #hledatObal {min-width: 0; width: 40px;}
   #hledatObal .q {display: none;}
   #hledatObal:not(.xsshow) .tlacitko {width: 100%;}
   #hledatObal.xsshow { width: 95vw; position: fixed; top:70px; left: 2.5vw; z-index: 1000; background: #fff; }
   #hledatObal.xsshow .q {display: inline-block;}
   #stranka { grid-template: auto auto / 100%; grid-template-areas: 'telo' 'sloupecL' }
   #katdiv {display: none;}
   #paticka { grid-template: auto auto / 100%; grid-template-areas: 'sl1' 'sl2'; }
}

@media (max-width:549px) {
   .obsah .left,.obsah .right { margin:.5em 0!important; float:none!important; display: block;}
}

@media (max-width:469px) {
   :root{ --podkat_sloupce:1; --zaknav-sloupce: 2; --cblist-sloupce:2; }
   .simpleform p label,.simpleform p input,.simpleform p select {width: 100%; }
   .podkat a { padding: .66em 1%; }
   .podkat.sfoto a { min-height: 0; }
   .podkat.sfoto .pic { display: none; }
   .slider1 {display: none;}
   .kform .sloup {width: 100%;padding:0; }
}


@media (max-width:849px) and (min-width:750px), (max-width:549px) {
   .respgbg,.respgbg tbody,.respgbg tr,.respgbg td {display: block; width: 100%;}
}

@media (max-width: 999px) {
   .column5 > div {width: 33%; }
}
@media (max-width: 849px) {
   .column4 > div {width: 50%; }
}
@media (max-width:549px) {
   .column3 > div {width: 50%; }
   .column5 > div {width: 50%; }
}
@media (max-width:469px) {
   .column2 > div {width: 100%; }
}