/* ============================ misto pro import webfontů ============================ */

.webfont1 {}
.webfont2 {}

/* ============================ obecne prvky ============================ */
html, body { min-height: 100%; padding: 0; margin: 0; }
body { font-size: 13px; font-family: 'Open Sans', sans-serif;  text-align: center; background: #f0ede3;}

a {text-decoration: underline; color: #068ed1; }
a img { border:0 }
img{ max-width: 100%; height: auto;}
h1 {  line-height: 1em; font-weight: 400; font-size: 30px; color: #191929; margin: 10px 0 0 0px; padding: 0 0 5px; }
h2 { margin: .6em 0 ; line-height:1.1em; font-weight: normal;}
h2.nomarginb { margin-bottom:0;}
h3 { line-height:100%; }
h1:first-letter {text-transform: uppercase}
h2 a { text-decoration: none; }
h3 a { text-decoration: none; }
h4 a { text-decoration: none;}
p {font-size: 16px; line-height: 160%;}
ul{ padding:0 0 0 15px; margin: 0 0 0 15px; }
ul li{ padding:0; margin-bottom: .5em;}
blockquote { background: none repeat scroll 0 0 #EEEEEE; border: 1px solid #DDDDDD; margin: 0 0 1.5em; padding: 10px 14px;}
blockquote p { font-size: 1.2em; margin: 0;}
table {}
table th {}
table td {}
hr { width: 100%; height: 1px; margin: 8px 0;  }

/* ============================ časté vlastnosti ============================ */
.hid{ display: none; }
.blok { display: block; }
.blokradek { display: inline-block; }
.table { display:table; }
.tr { display:table-row; }
.td { display:table-cell; }
.vlevo,.left { float: left; }
.vpravo,.right { float: right; }
.cleaner { clear: both; width: 100%; height: 0px; display: block;}

.nalevo { text-align: left; }
.napravo { text-align: right; }
.nastred { text-align: center; }
.dobloku { text-align: justify; }
.line-top{ vertical-align: top; }

.bez-paddingu { padding: 0; }
.bez-marginu { margin: 0; }
.bez-ohraniceni { border: none; }
.pruhledne-pozadi { background: transparent none; }
.pozadi1x { background-repeat: no-repeat; }
.pozadileft { background: left center no-repeat; }
.pozadiright { background: right center no-repeat; }
.pozaditop { background: center top no-repeat; }
.pozadibottom { background: center top no-repeat; }
.pozadistred { background: center center no-repeat; }
.transparent { width: 100%; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50);
               -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; }

.tucny  { font-weight: bold;}
.hubeny { font-weight: normal; }
.italika { font-style: italic }
.narovnany { font-style: normal; }
.podtrzeny { text-decoration: underline; }
.necarnuty { text-decoration: none; }
.preskrtnute {text-decoration: line-through; }
.mensi-pismo { font-size: .8em; }
.vetsi-pismo { font-size: 1.25em;  }
.velke-pismo { font-size: 1.5em;  }
.pismo2x { font-size: 2em; }
.pismoUp { text-transform: uppercase; }
.prvniUp:first-letter { text-transform: uppercase; }

.kurzor-sipka { cursor: default; }
.kurzor-otaznik { cursor: help; }
.kurzor-ruka { cursor: pointer; }
.radius-maly {border-radius: 3px;}
.radius-stredni {border-radius: 5px;}
.radius-velky {border-radius: 8px;}

.hoverline {text-decoration: none;}
.hoverline:hover {text-decoration: underline;}

.bublifuk {border-bottom:1px dashed;text-decoration: none;}

/* ============================ časté vlastnosti per web ============================ */
.mainbarva{color:#4da61b;}
.secbarva{}
.tercbarva{}
.gbarva{color:#eee;}
.gbarvatext{color:#888;}
.mainbg{background-color:#4da61b; }
.secbg{}
.tercbg{}
.gbg{background-color:#f3f3f3;}
.secfontsize{}
.tercfontsize{}

.chyba { font-weight: bold; margin: 20px 0; }
.hlaska { font-weight: bold; padding: 20px; background-color: #aaeeaa}
.tlacitko {border:0; cursor:pointer; text-align: center; background-color:#4da61b; color:#fff; text-decoration: none; padding: 1em 2em; line-height: 1em; }
.tlacitko:hover,
.tlacitko:active {}

.obalka-stranky{ height: auto; margin: 0 auto; position: relative; width: 1000px; max-width: 100%; }
.resptabwrap {overflow: auto; max-width: 100%;}

/* ============================ styly identifikované ============================ */

#graphics-container { position: absolute; left:0; top:0; height: auto; min-height:100%; width:100%;overflow:hidden;}

/* ============================ Hlavicka ============================ */

#pozadi {max-width: none; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top:0; max-height: 100%;}

#hlavicka {}
#hlavicka #logo { position:relative; float:left; margin: 0; width: 27%; left: 0px; top: 35px; z-index: 1000; }

.nazev {float: right;  height: 140px; margin:0px; vertical-align: middle;}
.nazev p {color: white; font-size: 24px; font-weight: 300; margin-top: 50px; }

#horizontalni-menu { position: relative; width:100%; clear: both; text-align: left; z-index: 1; background: url(/img/menu_bg.png); top: 0px; -webkit-border-radius: 3px;
                     -moz-border-radius: 3px; border-radius: 3px; margin: 0 0 20px;}
#horizontalni-menu div { position: relative; z-index: 1001;  }
#horizontalni-menu div:hover  {background: white; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px;-moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px;border-top-left-radius: 3px;border-top-right-radius: 3px; margin-bottom: 0px; }

#horizontalni-menu div.oddelovac { width:10px; height: 60px; padding:0; margin:0; background: url(/img/sep.png)}
#horizontalni-menu div.od { width:10px; height: 60px; padding:0; margin:0; }
#horizontalni-menu a { display:table-cell; text-decoration: none; padding: 0px 15px 0px 15px; vertical-align: middle; color: white; font-weight: 600; font-size: 16px; height: 60px; z-index: 1000; margin: 0px;}
#horizontalni-menu div.active a,
#horizontalni-menu  a:hover { color: white }
#horizontalni-menu div:hover  a {color: black;}

/* VysouvacĂ­ menu */
#horizontalni-menu .vysouvaci_menu { display: none; position: absolute; text-align: left; margin-top: 0px; width: auto; background: white; width: 300px; -webkit-border-radius: 3px;
                                     -webkit-border-top-left-radius: 0; -moz-border-radius: 3px;-moz-border-radius-topleft: 0;border-radius: 3px;border-top-left-radius: 0; height: auto; z-index: 1000;
                                     box-shadow: 1px 1px 5px -2px #000; }



#horizontalni-menu .vysouvaci_menu div {display:block; z-index: 1000; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  }
#horizontalni-menu .vysouvaci_menu div:last-child  a {border-bottom: 0px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  }
#horizontalni-menu div:hover .vysouvaci_menu,
#horizontalni-menu div:active .vysouvaci_menu {display:block; z-index: 1000; height: auto; color: white  }
#horizontalni-menu .vysouvaci_menu a { white-space: nowrap; font-weight: 300; font-size: 14px; padding-left: 35px; background: url(/img/arrow.png) left center no-repeat; border-bottom: 1px solid #e2e2e2;; display: block; height: 40px; line-height: 40px; height: auto	; color: white; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}


#horizontalni-menu .vysouvaci_menu a:first-child {}
#horizontalni-menu .vysouvaci_menu .active a,
#horizontalni-menu .vysouvaci_menu a:hover { color: #4da61b; font-weight: 600; -webkit-border-radius: 3px; -moz-border-radius: 3px;
                                             border-radius: 3px; }

#picmenu {width: 102%; margin: 0 0 20px; left:-1%; position: relative; text-align: center; font-size: 16px;}
#picmenu .box {display: inline-block; width: 14.7%; height: 160px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin: 0px .98%; text-decoration: none; text-align: center;overflow: hidden;color: white;position: relative; background: url(/img/box.jpg) bottom center no-repeat;}
#picmenu .box .link {color: #3c2207; text-decoration: none; font-weight: 700; display: block; line-height: 130%;}
#picmenu .box .link img { }
#picmenu .box .link .a { display: table; width: 100%; height: 60px;text-align: center; }
#picmenu .box .link .a span { padding: 0 10%; display: table-cell; vertical-align: middle; }
#picmenu .box .layer { position: absolute; top: 0; left:0; width: 100%; font-weight: 300; padding-top: 30px;height: 70px; display: none;background: rgba(100,200,50,.8); }
#picmenu .box .layer .tucne { font-weight: bold; }
#picmenu .box:hover .layer  { display: block; }

.pila {padding: 10px 0; }

#btnmenu {width: 102%; margin:0 0 30px; position: relative; left: -1%;}
#btnmenu a {display: inline-block; background: url(/img/button.png) repeat-x; width: 23%; color: white; text-decoration: none; margin: 0px .98%;padding:14px 0 14px;font-size: 16px; font-weight: 600; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  }
#btnmenu a:hover {background: url(/img/button.png) bottom;}

/* ============================ Boxy a struktury ============================ */

.obsah { background: #f0ede4; }
.uvodni .obsah { padding: 30px 0 0 0; }

#stranka {text-align: left; background: white; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; }
#stranka a {color: #4da61b;}

#telo { margin: 0 1%; width:90%; padding: 40px 4% 40px 4%; }
.uvodni #telo {}

#telo p {color: white;line-height: 150%;  }

#stred{ width: 100%; font-size: 16px; line-height: 150%;}
#stred .anotace {  }
#stred h1 {padding: 0 0 20px; color: black; font-weight: 600; font-size: 24px; background: url(/img/h.png) left bottom no-repeat;  }
#stred p { color: black;}
#stred blockquote p:last-child{ margin-bottom: 0; }
#stred p,#stred td{  }
#stred img {margin: 0 auto 0 auto;}
#stred p img,#stred td img { margin:0; }
#stred p img.left,#stred td img.left { margin-right: 15px; }
#stred p img.right,#stred td img.right { margin-left: 15px; }
#stred table {max-width:100%; border-collapse: collapse; }
#stred table.ramovana { border: 1px solid;}
#stred table.ramovana td,#stred table.ramovana th { border: 1px solid;}

ul.podkat { list-style-type:none; padding: 0; margin:-7px 0 0 0; }
ul.podkat li { width:28%; margin: 2%; line-height:120%; list-style-position: inside; overflow: hidden; border: 1px solid #eee; border-radius: 5px; display: inline-block;vertical-align: top;}
ul.podkat .pkfoto {display:block; height:140px; text-align: left; padding:12px 7%; position:relative; }
ul.podkat .pkfoto img {max-width: 100%; max-height: 100px; vertical-align: middle; margin: 40px 0 5px; padding:15px 0 0;}
ul.podkat li:hover {border: 1px solid #ccc; }
ul.podkat .posunute{ display:block;height:140px; line-height: 140px; text-align: right; max-width: 100%;}
ul.podkat .prekryv{ position:absolute; max-width: 100%;  text-decoration: underline; font-size: 1.2em; line-height: 1.5em;  }
ul.podkat.bezfoto li {padding: 0; }
ul.podkat.bezfoto li { margin:.75%; margin-left:0; margin-right: 1.5%; width: 30%; }
ul.podkat.bezfoto li a { padding: .65em 0;  display: block; text-decoration: none;}
ul.podkat.bezfoto .prekryv{ margin:0 .9em; position: relative; display: block; }

.fradek{ width:100%; margin: 10px 0;  }
.fradek .fotka{ display:inline-block; text-align: center; width: 33%; vertical-align: top; margin:5px 0; padding-bottom: 6px; }
.fradek .fotka img{ margin: auto; padding:2%; border: 1px solid #fafafa; max-width: 94%; margin-bottom: 2px;}
.fradek .fotka a{ margin:0; width: 100%;}
.fradek.prod .fotka{ width: 50% }

.file-link {list-style-type: none; padding-left: 0; margin-left: 0; max-width:700px; }
.file-link li { line-height: 1.2em;clear:both;border-bottom: 1px solid #eee;}
.file-link li a {width: 100%; display: block; text-decoration: none;padding: .9em 0;}
.file-link li a .tail { text-align: right; float:right;}
.file-link li a:hover .pod {text-decoration: underline;}
.file-link li img {vertical-align: middle; margin-right: 8px }

/* ============================ Modul slider ============================ */

.slider { height: auto; position:relative; padding: 0; clear:both; margin: 0 0 20px; }

.slider .navigace {  width:300px; position:absolute; bottom:40px; left: 40px }
.slider .navigace a { width: 13px; height: 13px; margin-left:8px; display: block; float: left; background-image: url('img/nav.png');}
.slider .navigace .aktualni {background-image: url('img/nav_activ.png')}

.slider .vnitrek a.vnitrek { display: block; width: 100%; height: 100%; }
.slider .bx-prev { display: none; position: relative; top: -90px; left: -30px; }
.slider .bx-next { display: none; position: relative; top: -90px; left: 615px; }
.slider #slider1 { position:relative; overflow: hidden}
.slider #slider1 .fotka { height:234px; line-height: 200px; text-align: center; display: block; border-radius:3px ; border: 3px solid #54ab06;overflow: hidden; }
.slider #slider1 .fotka img { vertical-align: middle; margin:auto; }


#produkt .bx-next {float:right;margin: 10px 0 20px;}
#produkt .bx-prev {float:left;margin: 10px 0 20px;}

/* ============================ Drobeckova navigace ============================ */

.drobeckova { color:#555; line-height: 2em; margin-top: -.5em; margin-bottom: 1em; padding: 0 2em; box-sizing: border-box; -moz-box-sizing: border-box;}
.drobeckova a {color:#4da61b; }
.drobeckova .odkaz { padding:0 ; margin:0 10px 0 0;}

/* ============================ Kontaktní formulář ============================ */
.kontaktform #mailform { padding: 20px; margin: 5px 0;}
.kontaktform #mailform input[type=text] {width: 100% }
.kontaktform #mailform input[type=submit] {margin-top:15px }
.kontaktform #mailform textarea { width: 100%}
.kontaktform #mailform label { width: 100%}
.kontaktform #mailform .post {display: none}
.kontaktform #mailform .frmhlaska { margin:0 0 15px 0; font-size: 1.3em; font-weight: bold}
.kontaktform #mailform .vlevo {width:45%;}
.kontaktform #mailform .vpravo {width:45%; }
.kontaktform { text-align: left; width: 60%}

/* ============================ Paticka ============================ */

#paticka { background:#f0ede3;border-radius: 3px;margin-top: 30px; padding-top: 20px; }
#paticka h2 {text-align: left;}

.patakontakty {width: 58%; float:left; margin: 0 0 0 4%;  }
.patakontakty a {color: #4da61b}
.patakontakty h2 {font-size: 24px; font-weight: 600; color: black; background: url(/img/h.png) left bottom no-repeat; padding: 0 0 20px; margin: 0px 0;}
.kontakt { width: 45%; display: inline-block; vertical-align: top; margin-right: 5%; text-align: left;}
.kontakt p {font-size: 14px;}

.patamapa {width: 30%; float: right; margin: 0 4%;}
.patamapa h2 {font-size: 24px; font-weight: 600; color: black; background: url(/img/h.png) left bottom no-repeat; padding: 0 0 20px;  margin: 0px 0 30px;}

.tiraz { text-align: left; font-size: 14px; padding: 20px 0 20px 40px; clear:both; }
.tiraz p {font-size: 14px; font-family: 'Open Sans', sans-serif; color: #7a7a7a; padding: 0px; margin: 0px; }
.tiraz a {color: #7a7a7a; text-decoration: underline;   }


/*========= ostatní zbytečnosti ========================================================*/
#eu-cookies { position: fixed; left: 0; bottom: 0; text-align: center; background: #dcdcdc; color: #000; z-index: 100001; opacity: .8; width: 100%; padding: .25em 0; font-size: 14px;}
#eu-cookies a { color: #000;}
#eu-cookies p { display: inline-block; margin:0 1em; }
#eu-cookies .listittlacitko { display: inline-block; margin:0 1em; padding: 0 .5em; background: #818182; text-decoration: none; }


/* ============================ Responzivita ============================ */


@media (max-width: 999px) {
   #stred .fradek .fotka{ width: 33% }
   .kontaktform { width: 70%}

   .nazev {float: right;  height: 130px; margin:0px; width: 50%;}
   .nazev p {color: white; font-size: 24px; font-weight: 300; margin-top: 50px; text-align: right; padding: 0 3%; }

   #hlavicka {background: transparent;}
   #hlavicka #logo  { height: auto; margin: 0px;width: 35%; display: block; }

   #picmenu .box {width: 29.4%;max-width: 150px; margin-bottom: 8px;}

   #stranka {background: white; margin:0px 0 30px 0; }
   #stred {margin: 0px; width: 96%; padding: 1%; }

   #telo {width: 98%; padding: 1%; margin: 0px; float: left; }
   #horizontalni-menu {width: 100%; }
   #horizontalni-menu div.oddelovac { width:1px;}
   #horizontalni-menu a {  padding: 0px 10px 0px 10px; }
   .claim {width:100%;}
   .footertext {width: 90%}

   .patakontakty {width: 96%; padding: 0 2% 0 2%;}
   .kontakt {width: 45%; min-height: 150px;}
   .patamapa {float: left; width: 96%; padding: 0 2% 0 2%;}

   #horizontalni-menu {width: 100%; top: 0px;}

   .slider {display:none;}
}

@media (max-width: 755px) {
   #sloupec-levy,#telo {float:none; width:98%; margin: 0 1%;}
   ul.podkat li,ul.podkat.bezfoto li { width:45%; }
   .kontaktform { width: 80%}
   #btnmenu a {width: 46%; margin-bottom: 8px}
   #horizontalni-menu {width: 100%; top: 0px;}

   .neuvodni .hider {display: none;}
   .uvodni .shower{display: none;}
   .shider {display:none;}
}

@media (min-width: 755px) {
   .shower{display:none;}
}

@media (max-width: 699px) {
   .nazev{display:none;}
   #hlavicka #logo  {float:none; width: 100%; height: 130px; top:15px;}
   #horizontalni-menu {width: 100%; }
}

@media (max-width: 589px) {
   .kontaktform { width: 90%; }
}

@media (max-width:499px) {
   #picmenu .box {width: 46%;}
}

@media (max-width:469px) {
   #stred .fradek .fotka{ width: 50% }
   ul.podkat .pkfoto {height: auto;}
   ul.podkat .pkfoto .prekryv {position: relative;}
   ul.podkat .pkfoto .posunute {display: none;}
   .kontaktform { width: 100%}
   .kontaktform #mailform .vlevo { width:90%; }
   .kontaktform #mailform .vpravo { width:90%; float:left;}
   #hlavicka #vprostred {display: none}
   #horizontalni-menu {width: 100%; top: 0px;}

   .kontakt {width: 95%; margin: 0; height: auto;}
}

@media (max-width:379px) {
   #picmenu .box,
   #btnmenu a {width: 96%; }
}
