body { font-family: 'Open Sans', sans-serif; letter-spacing:1px; line-height:160%; margin:0; padding:0; font-size: 16px; box-sizing: border-box;}
.alcent { text-align:center;}
.alleft { text-align:left;}
.alright { text-align:right;}
.alcenter { text-align:center;}
.flleft { float:left;}
.flright { float:right;}
.clearboth { clear:both;}
.clearleft { clear:left;}
.clearright { clear:right;}
.colred {color: #F00;}
.colgreen {color: #13a438;}

#head {position:relative; max-width:1300px; margin:0 auto; display: grid; grid-template-columns: 200px auto 320px; justify-items: start; align-items: end; padding: 24px 50px 32px 50px;}
#headlogo img {max-width: 220px;}
#headphone {width:100%; text-decoration: none; color: #000; font-size: 1.6em; transition: color 0.3s ease;align-self: center; text-align: center; color: #000;}
#headphone a {font-weight: 700; text-decoration: none; color: #000;}
#headphone:hover a {color: #000;}
#head p.tlachpobjed {text-align: center; margin-bottom: 10px; margin-top: 5px; } 
#head a.tlachpobjed {display:block; padding:15px 25px; background: #13a438; color:#FFF; font-size:1.3rem; font-weight:900; text-decoration:none; }

#mmenuobal {background: #bdbcbc; z-index: 5;}
#mmenu {position:relative; max-width:1300px; margin:0 auto;}
#mmenu1 > ul {margin: 0; padding:0; min-height: 45px;}
#mmenuico { display:none; color:#000;}
#mmenu ul.menuitems > li {position: relative; display: inline-block; padding:0; margin: 0;}
#mmenu li a {display:block; text-decoration: none; padding: 0.7em 1em; margin: 0; color:#222; font-weight: 600; text-transform: uppercase; font-size: 0.95em; line-height: 1.4em; transition: .1s color, .2s background-color;}
#mmenu li.menuitemf img {filter:brightness(0%) contrast(100%); max-height: 18px;}
#mmenu li.menuitemf:hover img {filter:brightness(100%) contrast(100%);}
#mmenu li.mactive a {color: #FFF; background: #13a438;}
#mmenu li.sactive > a {color: #FFF; background: #13a438;}
#mmenu li a:hover {color: #FFF; background: #13a438;}
#mmenu li.mmenulogo a {display:none;}
#mmenu li ul.submenuitems {display: none; padding:0;}
#mmenu li:hover ul.submenuitems {position:absolute; display: block; background: #ececec; z-index: 2; box-shadow: 1px 1px 4px #bbb; }
#mmenu li:hover ul.submenuitems li {display: block; text-align:center; margin:0; padding:0; width: auto;}
#mmenu li ul.submenuitems li a {display: block; white-space: nowrap; color:#000;}
#mmenu li ul.submenuitems li:hover a {color:#FFF;}
#mmenu li.mactive ul.submenuitems li a {display: block; white-space: nowrap; background:#ececec; color:#000;}
#mmenu li.mactive ul.submenuitems li a:hover {color: #FFF; background: #13a438;}
#mmenu ul > li.mmenulogo img {position:relative; top:5px; width: 0; margin:0; padding:0;  transition: width .5s;}
.fixni-menu {position: fixed; left: 0; top: 0; width:100%;z-index: 1; border-bottom: 1px solid #ddd;} 
.fixni-menu #mmenu ul > li.mmenulogo img {width: 80px;}
.fixni-menu #mmenu li.mmenulogo a {display:block;}
.fixni-menu #mmenu li.mmenulogo a:hover {background: none;}

#hpbanobal {background: url("images/hp-banner1.png") center center no-repeat; background-size:cover, 100%; height:365px; overflow: hidden;}
#hpban {position:relative; max-width:1300px; margin:0 auto;}
#hpban p {display: block; font-size: 3.3em; text-transform: uppercase; color: #13a438; margin-top: 35px; padding:0; line-height: 105%; font-weight: 700; margin-right: 3%;}
#hpban #hpbannermal {display: block; font-size: 2rem; margin-top: 40px;}


#ukkarty {width: 100%; text-align: center; margin-top: 0;}
#ukkarty div.ukkart {text-align: center; box-sizing: border-box; display: inline-block; margin: 30px 30px 30px 30px; overflow: hidden; vertical-align: bottom;}
#ukkarty div.ukkart a {display:block; position:relative; overflow: hidden; margin:0; padding: 0; width:300px; height: 200px; vertical-align: top; text-align:left; text-decoration: none;text-transform: uppercase; font-size: 1.5rem; font-weight:700; color: #575756;}
#ukkarty div.ukkart img {position: absolute; display:block; z-index: 1; opacity:1; height: 100%; width: 100%;}
#ukkarty div.ukkart span.uktext {position: absolute; display:block; z-index:2; top:0; padding:10px 15px; background: rgba(255,255,255,0.7); line-height: 130%;}


#aktualitablok {display: none;}
#aktualitablok.zobrazakt {display: block; max-width: 900px; margin: 20px auto; padding: 10px 20px; background: #1e1a64; color:#FFF; font-size:2rem; text-align: center;}
#aktualitablok.zobrazakt a {color: #FFF; font-size:1.5rem; line-height: 170%; font-weight: 600;}
#aktualitablok.zobrazakt p {margin:10px; font-size:1.5rem; line-height: 170%; font-weight: 600;}



#dalsislobal {margin: 30px 0;}
#dalsisl {position:relative; max-width:1300px; margin:0 auto;}
#dalsisl h1 {text-align: center;}
#dalsisl div.slkarty {box-sizing: border-box; display: inline-block; width: 100%; text-align: center; 	}
#dalsisl div.slkart {text-align: center; box-sizing: border-box; display: inline-block; width: 260px; margin: 30px 0 0 0; overflow: hidden; vertical-align: top;}
#dalsisl a.aihov {display:block; position:relative; height: 240px; width: 240px; overflow: hidden; margin:0 auto; vertical-align: top;}
#dalsisl div.uce {background: #FE0000;}
#dalsisl div.pneu {background: #eead26;}
#dalsisl div.ukl {background: #69c628;}
#dalsisl div.pra {background: #5cbdd3;}
#dalsisl div.aut {background: #14326b;}
#dalsisl div.kav {background: #663721;}
#dalsisl div.slkart-hover {position: absolute;opacity: 1; transition: opacity, top;  transition-duration: .3s; top: 100%; }
#dalsisl a.aihov:hover div.slkart-hover {opacity: 1; top:0%;}
#dalsisl p.pop {min-height: 50px; text-transform: uppercase;}
#dalsisl a.tlacnav {position: relative; display:inline-block; padding: 10px 15px; background: #8bc53e; color: #000; text-decoration: none; transition: background 0.3s ease;}
#dalsisl a.tlacnav:hover {background: #000; color:#FFF;}
#dalsisl p.tlachpobjed {text-align: center; margin-bottom: 50px;} 
#dalsisl a.tlachpobjed {padding:20px 30px; background: #13a438; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }

#contvyzvy h1, #cont h1, #contf h1, #dalsisl h1 {margin-top:60px; font-size: 2.2em; line-height: 1.5em; margin-bottom: 0.5em; font-weight: 600; text-transform: uppercase; color:#33b540;}
#contvyzvy h2, #cont h2, #contf h2, #dalsisl h2 {margin-top:50px; font-size: 1.2em; line-height: 1.5em; margin-bottom: 0.5em; font-weight: 500; text-transform: uppercase; color:#33b540;}
#contvyzvy h3, #cont h3, #contf h3, #dalsisl h3 { font-size: 1em; font-weight: 600; color: #33b540;}

#contobal {margin:0 2%;}
#cont {position:relative; max-width:1300px; margin:0 auto 20px auto;}
#cont a {color: #000;}
#cont img {max-width: 99%;}
#cont img.ikoopeli {margin: 15px;}
#cont div.hpico {display:flex; justify-content:space-around; margin: 50px 0;}
#cont div.hpico a {display:block; text-transform: uppercase; text-decoration: none; color:#000; text-align: center; vertical-align: top;}
#cont div.hpico a img {display: inline-block; width:110px; background-color: #960000;  transition: background-color 0.3s ease;}
#cont div.hpico a:hover img {background-color: #555;}
#cont div.hpico a span {display: block; font-weight: 600;}
#cont div.hpico a:hover {}
#cont span.kontpoz {color:#7e8c8d;}
#cont ul li {list-style-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='6'><rect fill='rgb(11%,10%,39%)' x='0' y='0' width='100%' height='100%' /></svg>");}
#cont p .seznamcislo { display:inline-block; background:#13a438; color:#FFF; font-size:1.5rem; font-weight:bold; border-radius: 50%; padding:10px; margin:8px;}
#contf div.ref:nth-child(even) {background: #ececec; margin:30px 25% 30px 0; padding: 9px 30px;}
#contf div.ref:nth-child(odd) {background: #ececec; margin:30px 0 30px 25%; padding: 9px 30px;}
#contf div.ref {text-align: right;}
#contf div.refte  {text-align: left;}
#contf img.logovtextu {margin:0 1px;}

#cont div.reffa {position:relative; display: inline-block; text-align: center;}
#cont div.reffa img {display: block; position: relative; margin-top: 10px; max-width: 95%;}

#contf div.refall {}
#contf div.refone p.refonejm {font-weight: bold;}
#contf div.refone { position:relative; display: inline-block; width: 24%; text-align:center; overflow: hidden; vertical-align: middle;}
#contf div.refone img {max-height: 100; max-width: 100%;}
#contf div.refone div.refone-hover {position:absolute; display:block; z-index: 2; font-size:2rem; text-align: center;width: 100%; height: 100%; background:rgba(0, 0, 0, 0.87); top:-100%;opacity: 1; transition: top;  transition-duration: .3s;}
#contf div.refone div.refone-hover > span {position:relative; display: block;  top:40%; color:#FFF; opacity:0; font-size: 1rem; text-transform: uppercase; font-weight: 600; transition: opacity;  transition-duration: .3s; transition-delay: 300ms;}
#contf div.refone:hover div.refone-hover {top:0;}
#contf div.refone:hover div.refone-hover > span {opacity:1;}
#cont p.tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
#cont a.tlachpobjed {padding:20px 30px; background: #13a438; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }
#cont p.tlachpobjedchr {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
#cont a.tlachpobjedchr {padding:20px 30px; background: #4c6d80; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }


#cont #kontblock {clear: both; background: #EEE; border: 1px solid #000; box-shadow: 2px 2px 2px #999; padding: 4px 10px;}

div.tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;}
div.tlachpobjed a {color: #000; text-decoration: none;} 
div.tlachpobjed p.tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
div.tlachpobjed a.tlachpobjed {padding:20px 30px; background: #1e1a64; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }

#contf a {color: #000;}
#contf img {margin:5px 30px; max-width: 90%}
#contf span.kontpoz {color:#7e8c8d;}
#contf ul li {list-style-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='6'><rect fill='rgb(0,150,0)' x='0' y='0' width='100%' height='100%' /></svg>");}
#contf div.obsobl:nth-child(even) {position:relative; background: #ececec; padding: 5px 5px 20px 5px;}
#contf div.obsobl:nth-child(odd) {background: #FFF; padding: 20px 5px;}
#contf div.obsobs {position:relative; max-width:1300px; margin:0 auto 20px auto;}
#contf p.tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
#contf a.tlachpobjed {padding:20px 30px; background: #13a438; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }
#contf p.tlachpobjedchr {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
#contf a.tlachpobjedchr {padding:20px 30px; background: #4c6d80; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }

#contk a {color: #000;}
#contk div.sk1 {position:relative; max-width:1300px; margin:0 auto 20px auto;}
#contk p.tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
#contk a.tlachpobjed {padding:20px 30px; background: #13a438; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }
#contk div.obsk2 {background:#13a438;}
#contk div.sk2 {position:relative; max-width:1300px; margin:0 auto 20px auto;}
#contk div.sk3 {position:relative; max-width:1300px; margin:0 auto 20px auto;}
#kontcol {display: table; position:relative; width: 100%; margin-top: 0px; padding-top: 20px;}
#kontcol .kontcol2r {display: table-row; max-width: 500px;}
#kontcol .kontcol2c {display: table-cell;}
#kontcol .kontcol2c a {}
#kontcol .kontcol2c hr {color:#13a438; max-width: 50%; text-align: left;}
#kontcol .kontcol2c span.kontline {display:block; width: 250px; height:2px; margin:10px 0; background: #FFF;}
#kontcol .kontcol2c img {max-width: 99%;}
#kontcol.kontmap .kontcol2c {position:relative; padding-bottom: 80px;}
#kontcol a {text-decoration: none; color: #000;}

#contvyzvy ul li {list-style-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='6'><rect fill='rgb(150,0,0)' x='0' y='0' width='100%' height='100%' /></svg>");}
#contvyzvy div.vyzvnaobal {margin-bottom: 20px;}
#contvyzvy div.vyzv:nth-child(odd) {background: #FFF; margin-top:10px; margin-bottom:10px; padding:10px 2% 30px 2%;}
#contvyzvy div.vyzv:nth-child(even) {background: #ececec; margin-top:10px; margin-bottom:0; padding:10px 2% 30px 2%;}
#contvyzvy div.vyzvobs {position:relative; max-width:1300px; margin:0 auto;}

#kont {position:relative; max-width:1300px; margin:0 auto;}
img.konmappusob {max-width: 99%;}

#kontform form span.formpopis {color: #555;}
#kontform span.formdotaz {display: block; margin-top: 20px;}
#kontform form input {border:none; border-bottom: 1px solid #555;}
#kontform form textarea {border:none; border-bottom: 1px solid #555;}
#kontform input.formkontr {display: none;}
#kontform input.formbut {margin-top:20px; padding: 10px 20px;  background: #1e1a64; color: #FFF; font-size: 1.3rem;}

#pataobal { clear:both; background: #1a1b18; padding-top: 80px; padding-bottom: 50px;}
#pata {position:relative; max-width:1300px; margin:0 auto; padding: 0 2%;}
#pata div.pattab {display:flex; justify-content:space-between; flex-wrap: wrap; width:100%;}
#pata h1 {color: #009741; font-size: 1.1em; font-weight: bold; margin-bottom: 1.5em; text-transform: uppercase;}
#pata span.zelena {color: #009741;}
#pata span.cervena {color: #ff7f03;}
#pata {color:#FFF;}
#pata a {color:#FFF; text-decoration: none;}
#pata a.patpopfor {background:#13a438; padding:1px 5px;}
#pata svg {max-width: 20px;}
#pata .pat2 a {font-weight: 300; font-size: 1.2em;}
#pata .pat3 a {display: block; color: #FFF; transition: color 0.3s ease;}
#pata .pat4 a {display: block; color: #FFF; transition: color 0.3s ease;}
#pata .pat3 a:hover {color:#009741;}
#pata .pat4 a:hover {color:#009741;}
#pata .tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;}
#pata .tlachpobjed a {color: #000; text-decoration: none;} 
#pata .tlachpobjed p.tlachpobjed {text-align: center; margin-bottom: 50px; margin-top: 50px;} 
#pata .tlachpobjed a.tlachpobjed {padding:20px 30px; background: #13a438; color:#FFF; font-size:1.5rem; font-weight:900; text-decoration:none; }


    /* Základní styly pro banner a modální okno */
    #cookie-banner {
      position: fixed;
      bottom: 0;
      left: 0;
      width: 100%;
      background: rgba(230,230,230,.95);
      padding: 20px;
      z-index: 1000;
      box-shadow: 0 -2px 5px rgba(0,0,0,0.2);
      display: none;
    }
    #cookie-bannerin {
    	position: relative;
	    max-width: 1000px;
	    margin: 0 auto;
    }
    #cookie-banner p {
      margin: 0 0 10px;
      font-size: 14px;
    }
    #cookie-banner button {
      margin-right: 10px;
      padding: 8px 16px;
      font-size: 14px;
      cursor: pointer;
    }
    /* Styl pro modální okno pro vlastní volbu nastavení */
    #cookie-modal {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.5);
      display: none;
      align-items: center;
      justify-content: center;
      z-index: 1001;
    }
    #cookie-modal-content {
      background: #fff;
      padding: 20px;
      width: 90%;
      max-width: 400px;
      border-radius: 5px;
    }
    #cookie-modal-content h2 {
      margin-top: 0;
    }
    #cookie-modal-content label {
      display: block;
      margin-bottom: 10px;
    }
    #cookie-modal-content input[type="checkbox"] {
      margin-right: 10px;
    }
    #cookie-modal-content button {
      padding: 8px 16px;
      font-size: 14px;
      cursor: pointer;
      margin-right: 10px;
    }
    /* Tlačítko pro správu souhlasu (vždy viditelné) */
    #manage-consent {
      background: none;
      border: none;
      cursor: pointer;
      padding-bottom:3px;
      color: #FFF;
    }


@media screen and (max-width: 1050px) {
 #mmenuobal {background:#ececec; text-align: right;}
 #mmenuico { display:inline-block; margin-top:5px; margin-right: 10px;}
 #mmenu1 { display:none;width:auto;}
 #mmenu:hover #mmenu1 {display:block;z-index:10; background: #ececec;}
 #mmenu #mmenu1 > ul {display:block; text-align: left; }
 #mmenu #mmenu1 > ul > li { width: 100%;}
 #mmenu #mmenu1 > ul > li > a {font-weight: 600;}
 #mmenu #mmenu1 a {font-weight: 100;}
 #mmenu li ul.submenuitems {display: block;}
 #mmenu li ul.submenuitems { margin-left:15px; border-left: 1px solid #000; list-style:none; }
 #mmenu li:hover ul.submenuitems {position:relative; display: block; box-shadow: none;}
 #mmenu li:hover ul.submenuitems li {position: relative; text-align:left;}

 .fixni-menu {position: relative;} 
 .fixni-menu #mmenu ul > li.mmenulogo img {display: none;}
}

@media screen and (max-width: 1400px) {
#hpbanobal {padding-left: 1%; padding-right: 1%;}
}
@media screen and (max-width: 1250px) {
#headphone a {display: block;}
#hpbanobal {height: 300px;}
#hpban p {font-size:2.7em;}
}
@media screen and (max-width: 1000px) {
#head {position:relative; max-width:1300px; margin:0 auto; display: block;}
#headlogo {display: block; float: left;}
#headphone {display: block;}
#head p.tlachpobjed {display: block; margin-top: 50px; clear: both;}
#hpban p {line-height: 120%; font-size: 2em;margin-top: 20px;}
#hpbanobal {height: 200px;}
#hpban #hpbannermal {margin-top: 20px; font-size:1.5rem;}
}
@media screen and (max-width: 900px) {
#headicon {display: block;}

#cont div.ref:nth-child(even) {margin:30px 15% 30px 0;}
#cont div.ref:nth-child(odd) {margin:30px 0 30px 15%;}
}

@media screen and (max-width: 800px) {
#hpban p {font-size: 1.7em;}
#hpban #hpbannermal {font-size: 1.1rem;}
#hpbanobal {height: 180px;}

#kontcol {display: block;}
#kontcol .kontcol2r {display: block;}
#kontcol .kontcol2c {display: block;}
}

@media screen and (max-width: 750px) {
#hpban p {font-size: 1.5em;}
#hpban #hpbannermal {font-size: 1rem;}
#headlogo {display: block; float: none; text-align: center;}
#headphone {clear: both;}
#hpbanobal {height: 150px;}

#cont div.ref:nth-child(even) {margin:30px 5% 30px 0;}
#cont div.ref:nth-child(odd) {margin:30px 0 30px 5%;}
}

@media screen and (max-width: 600px) {
#headlogo img {max-width:99%;}
#hpban p {font-size: 1.5em;}
#hpban #hpbannermal {font-size: 1rem;}
}
@media screen and (max-width: 550px) {
#cont div.refone {width: 48%;}
#head p.tlachpobjed {margin-top: 10px; }
#head a.tlachpobjed {display:block; padding:10px 10px; font-size:1.5rem; font-weight:900; text-decoration:none; line-height:120%;}
}
