* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
body {background:#002060 url('pozadi.png');margin:0;padding:0}
body {font-family: Calibri, Arial, sans-serif; text-align: center; font-size: 114% }
.obal { margin: auto; padding: 1em 0; width: 800px; position: relative; box-shadow: 0 0 1em rgba(0,0,0,0.66); }

.titulek { font-size: 350% }
a.logo { display: inline; float: left; padding: 0 0.25em; color: #002060; margin: 0; text-decoration: none; font-weight: bold; line-height: 1.4; text-shadow: 1px 1px 3px #606080; transition: 0.5s all }
a.logo:hover { text-decoration: underline }
.kod {float: right;height: 38px;padding: 0.25em 8px 0 0; font-size: 50% }
.kod p {float:left; width:1px; height:2em; margin: 0;  }
.pb {background:#002060}
.pc {background:#FFFFFF}
.titulek, menu, .obsah { width: 100%; overflow: hidden}
.titulek {border-bottom:0;text-align:left;background:#FFFFFF }

menu { background: #4060A0; margin: 0; clear: both; padding: 0; width: 100%; overflow: hidden; font-size: 110% }
menu li { width: 25%; display: inline; float: left; text-align: center; margin: 0; padding: 0; }
menu a { width: 100%; float: left; letter-spacing: 0px; line-height: 2.5em; color: #FFFFFF; text-decoration: none; background: #4060A0; font-weight: bold; transition: 0.5s all }
menu a:hover { letter-spacing: 1px; background: #204080; color: #FFF; border-color: #FFF }
menu a:hover b { text-decoration: underline }
.obsah {text-align: left; border-top:0; padding: 1em 1em 0.5em 1em;background:#FFFFFF;text-align:left}
.paticka {width:760px;color:#7090D0;text-align:right;font-size:85%;margin-top:4px}
.paticka a {color:#80A0E0}
.paticka a:hover {color:#FFFFFF}
h1, h2 { font-weight: normal; padding: 0; }
h1 { font-size:160%; margin: 0 0 0.5em 0; }
h2 { font-size:150%; margin: 1.75em 0 0.5em; }
h1 b, h2 b { border-bottom: 2px solid #C0D0F0; text-shadow: 1px 1px 2px #AAA; }
h3 {font-size:100%; font-style: italic; margin: 0.75em 1em -0.25em 1em; padding: 0.75em 0 0 0; border-top: 1px dotted #4060A0; display: list-item; list-style-type: square; }
h3.prvni { border: 0; margin-top: 0em; padding-top: 0.25em }
p { margin: 0.75em 0 }
ul {margin: 0.5em 0 0 1.75em; padding: 0;}
li {line-height:1.3em;list-style-type:square; margin: 0 0 0.6em 0; padding: 0}
p, li {line-height:1.5em}
i {letter-spacing:1px}
hr {border-color:#204080;margin:0;background:#204080;color:#204080;margin-left:1em;margin-right:1em}

a {color:#204080}
a:hover {color:#4060A0}

big {font-size:150%;line-height:0.5em;vertical-align:-0.1em}
address {
	position: absolute;
	top: 1.666em;
	margin-top: 2px;
	right: 2em;
	line-height: 1.5;
}
center {
	margin: 1em 0
}

#ukazka { float: right; width: 11.4em; text-align: center; font-size: 120%; padding: 0.5em; margin: 0.25em 0 0.5em 0.5em; background: #4060A0; color: #FFFFFF; border: 4px solid #204080; letter-spacing: 0; transition: 0.5s all; border-radius: 1em/3em; position: relative }
/*
#ukazka:after { content: "▼"; position: absolute; top: 1em; margin-top: -8px; left: 0.25em; font-size: 200%; color: #4060A0; }
#ukazka:before { content: "▼"; position: absolute; top: 1em; margin-top: 8px; left: 0.25em; font-size: 200%; color: #4060A0; }
*/
#ukazka.cvak { letter-spacing: 0.25px }
#ukazka:hover { letter-spacing: 1px; color: #FFF; background: #204080; border-color: #4060A0; border-radius: 1.5em/3em }
table { width: 100%; border-collapse: collapse }
td, th { border: 1px dotted #204080; padding: 0.25em; text-align: center }
th { border-style: solid; background: #204080; color: #FFF }
th.l { text-align: left }

a img { border: 0 }
.fotka { position: relative }
.editor a { float: right; margin-top: -2em }
.fotka a img { border: 5px solid transparent; transition: 0.5s all }
.fotka a:hover:after { background: rgba(0,32,96,0.15) }
.fotka a:hover img { border-color: rgba(0,32,96,0.15) }
.fotka a:after { position: absolute; left: -1.5em; top: 0; right: 0px; bottom: 0; content: ''; transition: 0.5s all }
.editor a:after { right: 239px }
.evidence a { display: block; margin-left: -5px }
.evidence a:after { bottom: 233px }
#okno { background: url('texty/okno-bez-etikety.png') no-repeat; width: 719px; height: 684px; margin: 0 auto 1em }
#okno img { visibility: hidden }
#okno.cvak img { visibility: visible; }
@media (min-width: 0)
{
  #okno img { opacity: 0; transition: 0.5s all; visibility: visible; }
  #okno.cvak img { opacity: 1 }
}

@media (max-width: 800px)
{
  body { font-size: 114% }
  img { max-width: 100% }
  #okno { max-width: 100%; height: 0; padding-bottom: 96%; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; background-size: contain }
  .obal { width: 100%; padding: 0.75em 0 }
  address { top: 1.416em; }
}
@media (max-width: 680px)
{
  body { font-size: 107% }
  .obal { padding: 0.5em 0 }
  .titulek { font-size: 300%; }
  address { top: 1.166em; }
}
@media (max-width: 560px)
{
  body { font-size: 100% }
  .obal { padding: 0.25em 0 }
  .titulek { font-size: 250%; }
  address { top: 0.916em; }
  #ukazka { display: none }
}
@media (max-width: 480px)
{
  menu li { width: 50% }
  .obal { padding: 0 }
  .titulek { font-size: 200%; }
  address { top: 0.666em; }
}