/* Autor J.Pecher 10.2019 */

@viewport { width: device-width; }
@-ms-viewport { width: device-width; }

html { font-size: 62.5%; } /* ziskame root 10px */

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

html, body, div { margin: 0; padding: 0; }
body { font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 1.6em /* 1.6em = 16px */; line-height: 1.5; text-align: left; }
body { color: #303030; background-color: #fff; }

body, caption, fieldset, h1, h2, h3, h4, h5, h6, input, legend, option, select, td, textarea, th { font-size-adjust: .5; }

/* Links and Buttons */

a { display: inline-block; font-weight: 400; color: #039; outline: none; text-decoration: underline; }
a:focus { }
a:hover { text-decoration: none; }

a.button { white-space: nowrap; }
a.button:focus { }
a.button:hover { }

a.tisk, a.next, a.prev { height: 24px; line-height: 24px;  white-space: nowrap; text-decoration: none; }

a.tisk { padding-right: 40px; background: transparent url(../obr/web/tisk.png) no-repeat right;  }
a.tisk:focus { }
a.tisk:hover { font-weight: 700; padding-right: 30px; }

a.next { padding-right: 40px; background: transparent url(../obr/web/vpravo.png) no-repeat right; }
a.next:focus { }
a.next:hover { text-decoration: underline; }

a.prev { margin-right: 10px; padding-left: 40px; background: transparent url(../obr/web/vlevo.png) no-repeat left; }
a.prev:focus { }
a.prev:hover { text-decoration: underline; }

/* Tags */

h1, h2, h3 { margin: 0 0 10px 0; padding: 0; font-weight: 700; line-height: 1.2; font-style: normal; text-align: center; }

h1 { font-size: 140%; }
h2 { font-size: 120%; }
h3 { font-size: 160%; }

input, optgroup, select, textarea, button { margin: 0; color: inherit; font: inherit; }

hr { display: none !important; }

input[type=text] { }
input[type=radio] { background: 0 none; border: 0 none; }
input[type=checkbox] { width: auto; background: 0 none; border: 0 none; }
input[type=file] { width: auto; }

input:focus[type=text], input:focus[type=password], input:focus[type=file], select:focus, textarea:focus { border: 1px solid #d00 !important; }

form  { display: block; margin: 0; padding: 0; }
fieldset { }
legend { }
label { }

ol { margin: 0 0 10px 20px; padding: 0; }
ul { margin: 0 0 10px 20px; padding: 0; }
ol li { }
ul li { }

ol.styled { font-weight: 700; color: #a0a0a0; }
ul.styled { }
ol.styled li { }
ul.styled li { }

ol.styled li a { color: #039; text-decoration: underline; padding: 1px 3px; } /* menu */
ol.styled li a:hover, ol.styled li a.active { color: #f00; text-decoration: underline; background-color: #fff7ce; }
ol.styled li a.active { font-weight: 700; }

p { margin: 0 0 10px 0; padding: 0; }

iframe { }

/* Global */

.alignleft   { display: block; float: left; }
.alignright  { display: block; float: right; }
.aligncenter { display: block; margin: 0 auto; }

.sizeauto { max-width: 100%; height: auto; overflow: auto; }
.full     { width: 100%; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; } /* for IE6 and IE7 */

.cleaner { clear: both; }
.no      { display: none; visibility: hidden; }
.hidden  { display: none; }
.nowrap  { white-space: nowrap; }
.wrap    { white-space: normal; }

.left    { text-align: left; }
.right   { text-align: right; }
.center  { text-align: center; }
.justify { text-align: justify; }

.bold   { font-weight: 700; }
.normal { font-weight: 400; }

.big   { font-size: 2.5em; }
.small { font-size: .85em; }

.upper { text-transform: uppercase; }
.lower { text-transform: lowercase; }

.black  { color: black; }
.blue   { color: blue; }
.brown  { color: brown; }
.gray   { color: gray; }
.green  { color: green }
.maroon { color: maroon; }
.orange { color: orange; }
.red    { color: red; }
.white  { color: white; }

/* Media */

img, video { max-width: 100%; height: auto; } /* responsive */
img, video { display: inline-block; font-size: 1em; color: #808080; text-align: center; }

/* Ruzne bloky a ramecky */

.box-ramecek {
  margin: 0 0 2px 0;
  padding: 10px 15px 30px 15px;
  border: 1px solid #2763c3;
  background-color: #f8f8f8;
}
.box-ramecek { -webkit-border-radius: .3em; -moz-border-radius: .5em; -o-border-radius: .3em; border-radius: .3em; }

input.okenko {
  float: left;
  height: 25px;
  color: #30303;
  border: 1px solid #606060;
  margin: 0 5px 5px 0;
  padding: 0 3px;
  background-color: #fff;
}
input.okenko { -webkit-border-radius: .3em; -moz-border-radius: .5em; -o-border-radius: .3em; border-radius: .3em; } 

input.tlacitko {
  display: inline-block;
  margin: 0;
  padding: 0;
  height: 25px;
  border: 1px solid #606060;
  outline: none; 
}
input.tlacitko { -webkit-border-radius: .3em; -moz-border-radius: .5em; -o-border-radius: .3em; border-radius: .3em; } 

input.tlacitko:hover {   border-color: #f00; }

img.obr1, img.obr2, img.obr3, img.obr4 { border: 1px solid #303030; }
img.obr1, img.obr2, img.obr3, img.obr4 { -webkit-border-radius: .3em; -moz-border-radius: .5em; -o-border-radius: .3em; border-radius: .3em; }
img.obr1, img.obr2, img.obr3, img.obr4 { -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .3); -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .3); box-shadow: 0 1px 0 rgba(0, 0, 0, .3); }

img.obr1 { float: left; margin: 10px 10px 10px 0; }

img.obr2 { float: right; margin: 10px 0 10px 10px; }

img.obr3 { float: left; margin: 0 10px 10px 0; }

img.obr4 { float: right; margin: 0 0 10px 10px; }

/* Wrappers */

#page { position: relative; max-width: 800px; width: 100%; height: auto; margin: 0 auto; }

/* Header */

#hlavicka {
  margin: 20px 0 0 0;
  padding: 0;
}

#hlavicka a { }
#hlavicka a:hover; { }

#head-a {
  position: absolute;
  top: auto;
  left: 0;
  width: 100%;
  height: 124px;
  background-color: #fff;
  overflow: hidden;
  text-align: center;
}
#head-a h1 { }

#head-b { /* header background */
  position: absolute;
  top: auto;
  left: 0;
  width: 100%;
  height: 124px;
  background: transparent url(../obr/web/hlavicka.png) no-repeat;
}

#head-c { margin-top: 130px; margin-bottom: 10px; height: 24px; text-align: right; }

#head-d { }

#head-d p { padding: 10px 10px; }

#head-d strong { color: #f00; }

#head-d a { }

/* Main */

/* --- obal --- */
#main {
  position: relative;
  width: 100%;
  text-align: left;
  margin: 0;
  padding: 0;
  background-color: #fff;
}

/* --- bocni sloupec --- */
#leftcol {
  clear: none;
  float: left;
  width: 28%; /* 2% margin */
  margin-right: 2%;
  overflow: hidden;
  margin-bottom: 25px;
}

/* --- hlavni sloupec --- */
#maincol {
  clear: right;
  float: left;
  width: 70%;
  overflow: hidden;
}

#maincol cite {
  margin: 0;
  padding: 0;
  font-style: italic;
  color: #b20000;
}

#maincol blockquote {
  margin: 10px 30px 10px 0;
  font-style: italic;
  color: #b20000;
  padding-left: 40px;
  background: transparent url(../obr/web/quotemarks.png) no-repeat left top;
}

#maincol h3  { color: #f00; }

#maincol p { text-indent: 1em; }

#maincol strong, #maincol em { color: #f00; }

#maincol img { }

#leftcol h2, #maincol h2 {
  margin: 0;
  color: #606060;
  background: #cff url(../obr/web/nadpis.png) repeat-x top;
  border: 1px solid #2763c3;
  border-bottom: 0 none;
}
#leftcol h2, #maincol h2 { -webkit-border-radius: .3em; -moz-border-radius: .5em; -o-border-radius: .3em; border-radius: .3em; }

@media screen and (max-width: 768px) { 
  #leftcol, #maincol { width: 100%; }
  #leftcol { margin-bottom: 25px; }
}

/* Footer */

#paticka {
  margin: 0 0 20px 0;
  padding: 6px;
  text-align: center;
  color: #303030;
  background-color: #f0f0f0;
  border: 1px solid #69f;
}

#paticka { -webkit-border-radius: .3em; -moz-border-radius: .5em; -o-border-radius: .3em; border-radius: .3em; }
#paticka { -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset; }

#paticka a { }
#paticka a:hover; { }