/*
 * CSS Reset Reloaded by Eric Meyer
 * http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
 * 
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
/* remember to define focus styles! */
:focus { outline: 0; }
body { line-height: 1; color: #333333; background: transparent; }
ol, ul { list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after,
q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }


/*
 * Compose To A Vertical Rhythm
 * http://24ways.org/2006/compose-to-a-vertical-rhythm
 *  
 */
 
body { font: 62.5%/1.5 sans-serif; }
ul, ol, dl, p { margin-bottom: 1.5em; }
li, dt, dd { margin-bottom: 0.3em; }
ul, ol, dl { margin-bottom: 1.8em; }
em { font-style: italic; }
strong { font-weight: bolder; color: #3b6359; }

/* třídy + elementy */
.clear {clear:both;}
.l {float:left;}
.r {float:right;}
.hidden {visibility:hidden;display:none;}

.inline li{
  display:-moz-inline-stack;
  display:inline-block;
  zoom:1;
  *display:inline;    
  margin-left:10px;   
}

.grid25 {
  float:left; width:25%;=width:24%;
}

.textDeco-u a, .textDeco-n a:hover, #text a:hover {
  text-decoration: underline;
}

.textDeco-u a:hover, .textDeco-n a{
  text-decoration: none;
}


h1, h2, h3 {
  font-family: sans-serif;
  font-weight: bold;
}


/* A tady nasleduje nas styl... */
body { 
  background: #0a231c url(img/bg-body.png) 0 0 repeat-x;
}

/* zakladni */

#main {
  position:relative;
  width:800px;
  margin:0 auto;
}

#logo {
  position:absolute;
  z-index:100;
  left:27px;
  width: 115px;
  height: 103px;
}

/* Content + content Uvod*/

#content-home {
  position:relative;
  width:800px;
  height:645px;
  margin:0 auto;
  z-index:0;  
}
#content-home h1 {
  display: none;
}
#content-home p {
  display:block;
  position:relative;
  font-size: 1.2em;
  color: #6a6f41;
  top:90px;
  left:325px;
  width:294px;
}

#content {
  position:relative;
  width:800px;
  min-height:400px;_height:400px;
  background: #bfc879 url(img/bg-content.png) 0 0 repeat-y;
  z-index:0;      
  padding-bottom:50px;
  font-size: 1.2em;
}

div#breadcrumb-bg { width: 100%; height: 30px; position: absolute; z-index: 0; top: 62px; background: #000; opacity: 0.04; filter: alpha(opacity=4); -moz-opacity: 0.04; }
div.breadcrumb { position: absolute; z-index: 99; top: 69px; left: 152px; font-size: 0.8em; color: #8a8f52; }
   div.breadcrumb a { color: #85782e !important; text-decoration: none; }
    div.breadcrumb a:hover { color: #7e3800 !important; text-decoration: underline; }
    div.breadcrumb a.home { padding-left: 18px; background: url(img/home.png) no-repeat; }

#content h1 { font-size:29px; color:#226a5d; padding-bottom:15px; margin: 0 -200px 0 0; }
#content h2 { font-size:20px; color:#624a26; padding-bottom:10px; }
#content h3 { font-size:15px; color:#2a4b43; padding-top: 4px; padding-bottom:7px; }

#content p, #content ul { color:#2a4b43; }
#content strong { color:#3b6359; }
#content a { color: #007077; }
 #content a:visited { color: #2a4b43; }
 #content a:hover { color: #7e3800; }

#content ul {
  margin: 0 0 1.7em 1.2em;
  padding: 0;
}
  #content ul li {
    background: url(img/li.png) left 4px no-repeat;
    padding: 0 0 0.2em 23px;
  }

#content #gradient {
  background: url(img/bg-gradient.png) repeat-x;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 203px;
  z-index: 0;
}

#content #text {
  position:relative;left:32px;
  padding-top:110px;
  width:480px;
  z-index: 2;
}

#help {
  position: relative;
  margin: 0 -20px 14px -14px;  
}
#help .header {
  width:507px;height:8px;
  background:url(img/bg-help-header.png) 0 0 no-repeat;
  overflow:hidden;
}
#help .content {
  width:507px;min-height:50px;_height:50px; z-index: 1;
  background:url(img/bg-help-content.png) 0 0 repeat-y;
}
#help .content .inner {padding: 4px 26px 0 18px;overflow:hidden;}

#help .footer {
  width:507px;height:13px;
  background:url(img/bg-help-footer.png) 0 0 no-repeat;
}
#help #arrow {
  position:absolute;left:500px;top:16px; z-index: 6;
  width:26px; height:18px;
  background: url(img/bg-help-arrow.png);  
}


p.img-kolaz img, p.img-foto img { position: absolute; }
p.img-foto img { bottom: -68px; =bottom: -65px; right: -250px; }
p.img-kolaz img { top: 110px; right: -270px; }

  p#kolaz-jak-pomoci img {
    width: 251px;
    height: 273px;
  }
  p#foto-jak-pomoci img {
    width: 221px;
    height: 301px;
  }
  p#kolaz-vzdelavani img {
    width: 239px;
    height: 231px;
    right: -288px;
  }
  p#foto-vzdelavani img {
    width: 216px;
    height: 304px;
  }
  p#kolaz-o-nas img {
    width: 241px;
    height: 281px;
  }
  p#kolaz-nase-projekty img {
    width: 195px;
    height: 254px;
    right: -260px;
  }
  p#kolaz-pro-volny-cas img {
    width: 215px;
    height: 304px;
    right: -260px;
  }
  p#kolaz-kontakty img {
    width: 94px;
    height: 266px;
    right: -200px;
    top: 120px;
  }
  p#kolaz-podporuji-nas img {
    width: 173px;
    height: 364px;
    right: -240px;
    top: 130px;
  }


/* Menu */

#menu {
  position:absolute;
  top:0px; 
  width:800px;
  height:62px;
  background:url(img/bg-menu-shape.png) 0 0 repeat-x;
  z-index:50;
}

#menu ul { position:relative; left:156px; top:22px; _position:absolute;_left:156px; }

#menu ul li { float: left; }

#menu ul li a {
  display: block;
  position: relative;
  z-index:999;
  height: 15px;
  color:#f0f2cc;
  font-family: sans-serif;
  text-decoration: none; 
  font-size:13px;
  opacity: 0.80; filter: alpha(opacity=80); -moz-opacity: 0.80;
  margin: 0 0 7px 0;
  text-indent: -9999px;
}

#menu ul a:hover {
  color:#ffffff;
  /*background:url(img/bg-menu.png) 0 100% no-repeat; */
  opacity: 1.00; filter: alpha(opacity=100); -moz-opacity: 1.00;
}
#menu ul li.act a, #menu ul li.act a:hover {
  color:#c6cc7e;
  z-index:1000;
  cursor: default;
  opacity: 0.80; filter: alpha(opacity=80); -moz-opacity: 0.80;
}
#menu ul li.act {
  opacity: 0.95; =filter: alpha(opacity=95); -moz-opacity: 0.95;
  background: url(img/bg-menu.png) center bottom no-repeat;
}

  #menu ul li a.o-nas {
    width: 42px;
    background: url(img/menu-o-nas.png) center top no-repeat;
  }
  #menu ul li a.nase-projekty {
    width: 99px;
    background: url(img/menu-nase-projekty.png) center top no-repeat;
  }
  #menu ul li a.pro-volny-cas {
    width: 94px;
    background: url(img/menu-pro-volny-cas.png) center top no-repeat;
  }
  #menu ul li a.vzdelavani {
    width: 82px;
    background: url(img/menu-vzdelavani.png) center top no-repeat;
  }
  #menu ul li a.jak-pomoci {
    width: 88px;
    background: url(img/menu-jak-pomoci.png) center top no-repeat;
  }
  #menu ul li a.ke-stazeni {
    width: 76px;
    background: url(img/menu-ke-stazeni.png) center top no-repeat;
  }
  #menu ul li a.kontakty {
    width: 65px;
    background: url(img/menu-kontakty.png) center top no-repeat;
  }




#kolaz-menu {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	list-style: none;
}
#kolaz-menu li {
	display: block;
	float: left;
	position: relative;
}
#kolaz-menu a {
	display: block;
	position: absolute;
	text-indent: -9999px;
	z-index: 5;
	text-decoration: none;
}
 #kolaz-menu a:hover {
   border-color: #eee;
 }
  #kolaz-menu a.o-nas { top: 440px; left: 520px; width: 100px; height: 200px; }
  #kolaz-menu a.nase-projekty { top: 390px; left: 146px; width: 90px; height: 250px; }
  #kolaz-menu a.podporuji-nas { top: 130px; left: 160px; width: 100px; height: 250px; z-index: 8; }
    #kolaz-menu a.podporuji-nas em { right: -105px; }
  #kolaz-menu a.pro-volny-cas { top: 110px; left: 610px; width: 130px; height: 250px; z-index: 8; }
    #kolaz-menu a.pro-volny-cas em { left: -80px; }
  #kolaz-menu a.vzdelavani { top: 320px; left: 680px; width: 80px; height: 220px; z-index: 5; }
    #kolaz-menu a.vzdelavani em { left: -85px; }
  #kolaz-menu a.jak-pomoci { top: 240px; left: 260px; width: 160px; height: 220px; z-index: 6; }
    #kolaz-menu a.jak-pomoci em { left: -75px; }
  #kolaz-menu a.ke-stazeni { top: 480px; left: 300px; width: 140px; height: 160px; }
    #kolaz-menu a.ke-stazeni em { right: -30px; }
  #kolaz-menu a.kontakty { top: 364px; left: 26px; width: 80px; height: 255px; }
    #kolaz-menu a.kontakty em { right: -95px; }
  
#kolaz-menu em {
  width: 120px;
	height: 66px;
	position: absolute;
	top: -55px;
	left: 0;
	text-align: center;
	padding: 17px 0 0 0;
	font-style: normal;
	z-index: 2;
	display: none;
	text-indent: 0;
	font-size: 13px;
	font-weight: bolder;
	color: #000;
	z-index:0 !important;
}

  #kolaz-menu .bubble-left em {
    background: url(img/bubble-left.png) no-repeat;
    left: -95px;
  }
  #kolaz-menu .bubble-right em {
    background: url(img/bubble-right.png) no-repeat;
    left: auto;
    right: -100px;
  }
  
  #bubble-preload {
    position: absolute;
    left: -9999px;
    background: url(img/bubble-left.png) no-repeat;
  }
  #bubble-preload span {
    background: url(img/bubble-right.png) no-repeat;
  }


/* Rozcestník box s textem */

#roz-cest {
  position:relative; top:2px;
  width:798px;
  min-height:195px; _height:195px;
  background:#0a2519 url(img/bg-roz.gif) 0 0 repeat-x;
  border: 1px solid #092019;  
}
  #roz-cest .padding {
    padding: 14px 0 20px 20px;
  }
  #roz-cest h3 { color:#bbc65b; font-size:15px; margin-bottom: 0.5em; }
  
  #roz-cest p, #roz-cest li { color:#6c7842; font-size:1.1em; line-height: 1.6; }
  
  #roz-cest p.tel { color:#788602;
                    margin-bottom:0; padding-left:12px;
                    background:url(img/bg-roz-tel.png) 0 50% no-repeat; }
  
  #roz-cest a { color:#a6bb5e; }
   #roz-cest a:hover { color:#bae132; }
  .padding>a { font-size:1.1em; }
  
  #roz-cest li {
    background:url(img/bg-roz-a.png) 0 5px no-repeat;
    padding:0 0 0 12px;
    margin: 0; 
  }
  
  #roz-cest a.email {
    background:url(img/bg-roz-email.png) 0 50% no-repeat;
    padding-left:18px;
  }

a#facebook {
  background: url(img/link-facebook.png) no-repeat;
  width: 71px;
  height: 16px;
}

a#twitter {
  background: url(img/link-twitter.png) no-repeat;
  width: 20px;
  height: 22px;
  margin-left: 30px;
}

a#twitter,a#facebook { display: block; float: left; margin-top: 20px;filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; text-indent:-9999px; }
a#twitter:hover,a#facebook:hover { filter: alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; }


/* Partneri */
        
#partneri {
  position:relative;top:4px;
  width:798px;
  min-height:50px;_height:50px;
  background:#092a1b;
  border: 1px solid #081d17;
  text-align:center;  
}  
#partneri a img{
  margin: 0 5px 0 0; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;  
}
#partneri a:hover img{
  filter: alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;
}

#partneri ul { position:relative; top:10px; left: -8px; }

/* Footer */

#footer {
  position:relative;top:10px;
  width:800px;
  margin:0 auto;
  color:#305147;
  font-size:11px;
  height:50px;  
}

#footer p { text-align:right; }
#footer a { color: #507167; }
 #footer a:hover { color: #b0c8c1; }

div.blog-vypis p { display: inline; }
h2.blog-header { margin-bottom: -6px; }
p.blog-comments { text-align: right; }
  p.blog-comments a { padding: 5px 0 5px 40px; background: url(img/blog-comments.png) no-repeat; } 
p.blog-article-info { margin: 0 0 10px 0; opacity: 0.6; -moz-opacity: 0.6; filter: alpha(opacity=60); }

div.blog-comment { position: relative; padding-top: 1em; border-top: 1px dotted #444; }
  div.blog-comment h4 { color:#2a4b43; font-size: 1.2em; font-weight: bold; margin-bottom: 0.4em; }
    div.blog-comment h4 a { text-decoration: none; }
  div.blog-comment p.date { font-size: 0.9em; position: absolute; top: 1em; right:0; opacity: 0.8; -moz-opacity: 0.8; filter: alpha(opacity=80); }
  
form#blog-comment-add {

}
  form#blog-comment-add fieldset {
    margin: 10px 0;
  }
    form#blog-comment-add textarea {
      width: 400px;
      height: 80px;
      font: 1em sans-serif;
    }
    
    form#blog-comment-add textarea, form#blog-comment-add input[type="text"] {
      background-color: rgba(255,255,255,0.3);
    }
    form#blog-comment-add input[type="text"] { width: 200px; }
    input.submit { cursor: pointer; }

hr.clear { display: block;visibility: hidden !important; height: 0; line-height: 0; overflow:hidden; margin: 0; padding: 0; border: 0; }

/* Nacteni posledniho velkyho obrazku + fonty*/

#content-home {
  background:url(img/bg-kolaz-uvod.jpg) 0 0 no-repeat;    
}


/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.

Copyright 2006 – 2008 Mark Wubben, <http://novemberborn.net/>

Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben

See also <http://novemberborn.net/sifr3> and <http://wiki.novemberborn.net/sifr3>.

This software is licensed and provided under the CC-GNU LGPL.
See <http://creativecommons.org/licenses/LGPL/2.1/>
*****************************************************************************/

@media screen {
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
  }
}

@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
  }
}

/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {

  .sIFR-active h1, .sIFR-active h2, .sIFR-active h3 {
    font-family: sans-serif;
    visibility: visible;
  }

}

