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

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

/*========= obecné =====================================================================*/
body { margin:0; background: url(/img/bg_gradient.png) 0 420px repeat-x #3f99cc; }
.container { min-height: 100%; background: url(/img/bg_pattern.png); }
.top-bg {background:url(/img/bg_top.png) center bottom no-repeat; height: 603px; position: absolute; width: 100%;}
img {max-width: 100%;}
a img {border:0;text-decoration: none;}
a {text-decoration: underline;}

h1 {font-size: 2em; margin: 1em 0; padding: 0;}
h2 { font-size: 1.5em; font-weight: normal; margin: 1em 0 0.5em;}
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 1em 20px; margin: 0 0 0 20px; overflow: hidden; list-style: url(/img/licko.png); line-height: 1.5em;}
ul li{ padding:0 0 0 1em; margin: 0; }
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;  }

/*========= 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.2em;  }
.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%;}

.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; }

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

.tlacitko {color:#fff; background:#07b; border: 0; padding: .75em 1.5em; line-height: 1em; font-weight: bold; text-decoration: none; cursor: pointer; display: inline-block; border-radius: 3px;}
button.tlacitko,input[type=submit].tlacitko {}
.tlacitko:hover {}
button.tlacitko:hover,input[type=submit].tlacitko:hover {}

span span.wasteofspace{ background: url(/img/menu-w.png) left center no-repeat; min-height: 19px; height: auto; padding-left: 30px; display: inline-block; vertical-align: middle}

/*========= společné definice (barvy, chování apod.) ===================================*/
h1:first-letter,h2:first-letter,h3:first-letter,p.h2:first-letter,p.h3:first-letter {text-transform: uppercase}
a,.mainbarva { color:#07b }
h1,h2 { color: #07b; }
.gbg, .kform form {background: #f3f3f3;}
.mainbg {background: #07b; color:#fff;}
.mainbg a {color:#fff;}

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

/*========= prvky hlavičky =============================================================*/
.hlavicka { padding: .1px 0 30px; background: url(/img/hlavicka-stin.png) center bottom no-repeat; background-size: 100% 30px; }
.logo {display: block; float: left; width: 100%; max-width: 253px;margin: 40px 0;}
.stred {float: right; width: 30%;  line-height: 1.5em; width: 62%; margin-top:24px;}
.stred > div { display: inline-block; vertical-align: top; width: 54%; box-sizing: border-box; padding: 1em 3%; text-align: right; }
.stred .pravak { border-left: 1px solid #c8deea; text-align: left; min-height: 90px; width: 46%; padding-top: 1.5em;}
.stred .pravak .tlacitko { text-align: center }
.stred p {margin-top: 0;}

/*========= jazyky =====================================================================*/
.vlajky { text-align: right;float: right; background: url(/img/header_lang.png) left center no-repeat;  width: 5.5%; padding: 20px 0; }
.vlajky a {margin: 5px 0; display: inline-block; margin-left: 1em; }
.vlajky a img {vertical-align: middle;}

/*========= menu =======================================================================*/
.hmenu {width: 100%; clear: both; display: table; background: url(/img/menu-gradient.png); border-radius: 0 0 5px 5px; overflow: hidden; font-weight: bold;}
.hmenu a {text-decoration: none; display: table; width: 100%;}
.hmenu .radic { display: table-cell; vertical-align: middle; position: relative; }
.hmenu .msp { display: table-cell; vertical-align: middle; padding: 0 1em; line-height: 1.5em; height: 70px; text-align: center; z-index: 10; position: relative; color: #fff;
              -webkit-transition: color 0.175s linear;  /* Saf3.2+, Chrome */
              -moz-transition: color 0.175s linear;  /* FF4+ */
              -ms-transition: color 0.175s linear;  /* IE10 */
              -o-transition: color 0.175s linear;  /* Opera 10.5+ */
              transition: color 0.175s linear;}
.hmenu a:hover .msp { color:#07b;
                      -webkit-transition: color 0.75s linear;  /* Saf3.2+, Chrome */
                      -moz-transition: color 0.75s linear;  /* FF4+ */
                      -ms-transition: color 0.75s linear;  /* IE10 */
                      -o-transition: color 0.75s linear;  /* Opera 10.5+ */
                      transition: color 0.75s linear; }
.hmenu a.active .msp {color:#07b;}
.hmenu .overlay {background: url(/img/menu_hover.png) repeat-x; position: absolute; width: 100%; height: 100%; left:0; right:0; z-index: 1; opacity: 0;
                 -webkit-transition: opacity 0.175s linear;  /* Saf3.2+, Chrome */
                 -moz-transition: opacity 0.175s linear;  /* FF4+ */
                 -ms-transition: opacity 0.175s linear;  /* IE10 */
                 -o-transition: opacity 0.175s linear;  /* Opera 10.5+ */
                 transition: opacity 0.175s linear;}
.hmenu a:hover .overlay { opacity: 1;
                               -webkit-transition: opacity 0.75s linear;  /* Saf3.2+, Chrome */
                               -moz-transition: opacity 0.75s linear;  /* FF4+ */
                               -ms-transition: opacity 0.75s linear;  /* IE10 */
                               -o-transition: opacity 0.75s linear;  /* Opera 10.5+ */
                               transition: opacity 0.75s linear;}
.hmenu a.active .overlay{opacity: 1;}
.hmenu .oddelovac {width: 1px; height: 70px; background-color: #169; }

/*========= prvky stránky ==============================================================*/
.stranka { padding: 1px 0 2em; margin:0; background: #fff; border-radius: 5px }
.uvodni .stranka {background: url(/img/header_photo.jpg) center top no-repeat #fff;padding-top: 29%; background-size: 100% auto;}

/*========= obsah ======================================================================*/
.telo {padding:0 3.5% 2em; margin:0; box-sizing: border-box;}
.uvodni .telo {width: 69%; float: left;}

.obsah { line-height: 1.8em; position: relative; }
.obsah p { margin-top: 0;}
.obsah table {max-width:100%;}
.obsah td {}
.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 ul { line-height: 1.5em;}

.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.1em; }

/*========= drobečková =================================================================*/
.drobnav {line-height: 1.75em; margin: 1em 0; }
.drobnav a {}
.drobnav .prvek { padding:0; margin:0; display: inline-block;}
.drobnav .odd {margin: 0 .75em;}

/*========= podstránky =================================================================*/
.podkat {width: 100%; margin-top: 1em; }
.podkat a {width: 30.3%; margin: 1em 1.5%; font-size: 1.1em; display: inline-block; vertical-align: top; border: 1px solid #eee; padding: .33em 1%; position: relative; box-sizing: border-box; }
.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 ====================================================================*/
.sloupec-pravy { width: 27%; float: right; margin: -14.1% 0; background: url(/img/sidebar_bottom.png) left bottom no-repeat; border-radius: 5px; font-size: 1.15em; overflow: hidden; padding-bottom:1.75em;  overflow: hidden; margin-right: 4%;}
.sl-box { padding: 00; background: #eee; line-height: 1.25em;}
.sl-box p {margin-top: 0; padding-right:3.5%;}
.sl-box h2 { background: url(/img/sidebar_top.png) center top no-repeat; color: #fff; font-size: 1.07em; font-weight: bold; height: 58px; margin: 0; padding: 25px 0 0 22%; margin-bottom:1em; width: 80%;  }
.sl-box ul { padding-right:3.5%;line-height: 1.25em; margin-left: 30px;}
.sl-box ul li { margin-top: 1.1em; }

/*========= šablony ====================================================================*/
.resp2col,.resp2col tbody {width: 100%;}
.resp2col td {width: 50%; padding: .25em 0;}
.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;}

/*========= kontaktní formulář =========================================================*/
.kform { text-align: left; padding: 0 0 1em; width: 60%; display: inline-block; vertical-align: top; }
.kform form { padding: 1.5em 3% .5em; }
.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 input[type=text],.kform select,.kform textarea {width: 100%; padding: .5em; border:0;}
.kform textarea { height: 4.25em;}
.kform .tlacitko {}
.kform .plnSed { font-style: italic; color:#777;}
.telo .kform {padding-top: .5em;}

/*========= prvky patičky ==============================================================*/
.paticka {background: #fff; padding:1px 3.5% 2em; margin-top: 1em;border-radius: 5px}
.psloup {width: 35%; margin-left: 5%; display: inline-block; vertical-align: top;}

.zakonceni { text-align: right; padding: 1.5em 4.5% 4em;position: relative; font-size: .86em; color: #fff;}
.zakonceni a { color: #fff; font-weight: bold;}

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

/*========= 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; }

.babish { text-align: left;}

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

@media (max-width:999px) {
   .max-sirka {width: 96%; margin: auto 2%;}
   .uvodni .stranka {background-image: none; padding-top: 1em;}
   .sloupec-pravy {margin-top: 0;margin-bottom: 0; }
   .sl-box h2 { background:#07b; margin: 0; padding: 1em 30px; width: 100%; box-sizing: border-box; height: auto;}
}

@media (max-width:899px) {
   .vlajky {width: 55px;}
   .stred { width: 55%; }
   .stred .levak { display: none;}
   .stred .pravak { border:0;width: 100%; padding: 1em 0; text-align: center;}
}

@media (max-width:799px) {
   .uvodni .gallery .box,.gallery .box {width: 50%; }
   .podkat a {width: 47%;  }
}

@media (max-width:749px) {
   .stred { width: 33%; }
   .hmenu {background-size: 1px 50px;}
   .hmenu .radic{ display: block; text-align: center;}
   .hmenu .oddelovac{ display:none;}
   .hmenu .msp { padding:0; height: 50px;}
   .kform,.psloup,.sloupec-pravy {width: 100%; margin: auto; float: none;}
   .telo,.uvodni .telo{width: 100%; margin: auto; float: none;}
   .neuvodni .hider { display:none!important; }
   .uvodni .shower { display:none!important; }
}

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

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

@media (max-width:499px) {
   .eu-cookies { position: static; padding-bottom: .5em; margin-bottom: .5em; }
}

@media (max-width:469px) {
   .logo { text-align: center; max-width: none; float: none; margin: 1em 0;}
   .vlajky {width: 100%; text-align: center; clear: both; float: none; margin: 2em 0; padding: 0; background: none;}
   .vlajky a {display: inline-block; vertical-align: middle; margin: 0 .5em;}
   .podkat a {width: 97%; margin: .5em 1.5%; padding: .66em 1%; }
   .podkat.sfoto a { min-height: 0; }
   .podkat.sfoto .pic { display: none; }
}

@media (max-width:399px) {
   .kform .sloup {width: 100%;padding:0; }
}

@media (max-width:299px) {
   .uvodni .gallery .box,.gallery .box {width: 100%; }
}


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

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