#headbar
{    
    margin: 0 auto;
    height:100%;    
    width: 1020px;
    width: var(--sitewidth);
}
/*.h1_lista, .h1_lista_el, .h1_lista_hb
{
    color:#fff;
    text-align: left;
    position: relative;
    top: 300%;
    height: 0px;
    z-index: 10;
    line-height: 1;
}*/
.h1_lista_el
{
    left: 0px;
}
/*.h1_lista_hb
{    
    top: 280%;
}*/
.h1_lista h1 /*uvodni*/
{
    letter-spacing: 1px;
    font-weight: bold;
    font-size:2.7vw;
}
.h1_lista h1 span /*uvodni*/
{    
    font-weight: 800; /*extrabold*/
    font-size: 4vw;
}
.h1_lista_el h1
{
    text-align: left;
}
.h1_lista_el /*neuvodni*/
{
    color:#aaa;
    text-align: right;
    padding-right: 30px;
    position: absolute;
    right: 20px;
    top: 160px;
    display: none;
}
.h1_lista_el h1
{
    font-size: 90%;
    text-align: right;
}
.h1_uv_zvp, .h1_uv_hb, .h1_uv_mb
{
    position: relative;
    color:white;
    font-size: clamp(30px, 5vw, 90px);
    line-height:115%;
    font-weight:900;
    transform: scaleX(0.95);
    transform-origin: left;
    padding-left:40px;
}
.h1_uv_hb
{
    font-weight:600;
}
.h1_uv_mb
{
    font-weight:800;
}
.h1_uv_zvp .cap2, .h1_lista_zvp .normal
{    
    font-weight:400;
    transform: scaleX(1);
    letter-spacing: 0.01em;
}
.h1_uv_hb .cap2
{
    font-weight:800;
    font-size: 110%;
}
.h1_uv_mb .cap2
{    
    font-weight:400;
/*    display: inline-block;
    transform: scaleX(1.12);
    transform-origin: center center;*/
    letter-spacing: 0.02em;
    /*padding-left: 14px;*/
}


.content_top_image{
    position: relative;
}

.content_top_image img{
    width: 100%;
    max-width: 1880px; /* nebo kolik chceš */
    height: auto;
    margin: 0 auto;
    display: block;
}

.content_top_image .h1_lista_hb, .content_top_image .h1_lista_zvp{
    position: absolute;
    top:20px;
    inset: 0;                 /* overlay přes celý obrázek */
    display: flex;
    align-items: center;      /* vertikální střed */
    margin: auto;             /* centrování sitewidth */
    pointer-events: none;     /* aby text neblokoval kliky */
}
.content_top_image .h1_lista_zvp{
    top:50px;
}

.h1_lista_hb h1, .h1_lista_zvp h1{
    font-size: clamp(32px, 4.5vw, 80px); /* responzivní velikost */
    font-weight: 800;
    line-height: 1.1;
    color: white;
    margin: 0;
    padding-left: 35px;
}

.h1_lista_hb h1 span.regular{
    font-weight: normal;
}


#head02.head_hb img
{
    width:100%;
}


.logo
{
    width:200px;
    height:120px;
    float:left;
    clear: both;
}
.logotext{
 }
.logotext
{
    width:80px;
    height:85px;
    float:left;
    border-left:4px white solid;
    color: white;
    text-decoration: none;
    margin-top:25px;
    margin-left:200px;
    padding: 5px 0 0 10px;    
}
.spbutton
{
    background-color:  #fff;
    margin-left: 15px;
    text-transform: uppercase;
    color:black;
}
.spbutton a
{
    color:black;
}
.navigace
{
    margin-top: 2px;
    text-align: left;
    padding-left: 3px;
    width:700px;
    white-space: nowrap;
    font-size:80%;
    color: #eee;
}
.navigace a
{
    color: #eee;
}
#hlavnimenu_03 {
    float:right;
    margin-top: 51px;
    font-weight: 600; /*open sans semibold - 600*/
    margin-right: 30px;
}

#hlavnimenu_03 ul li {
    list-style: none;
    display: inline-block;
    position: relative;
    overflow: visible;
    padding:0 22px;
    font-size: 110%;
}
#hlavnimenu_03 ul li ul {
    list-style: none;
    display: inline-block;
    position: absolute;
}
#hlavnimenu_03 ul li a {
    text-decoration: none; 
    color: #fff;
    white-space: nowrap;
}
#hlavnimenu_03 ul li.spbutton a {
    color: black;
}

@media (max-width:1620px) { .h1_lista {top: 220%;} .h1_lista_hb {top: 200%;}}
@media (max-width:1440px) { .h1_lista_hb {top: 190%;}}
@media (max-width:1290px) { #hlavnimenu_03 ul li {padding: 5px 10px; } #head01{padding-right: 15px;}.h1_lista_hb {top: 150%;}}
@media (max-width:1170px) { .logo {width:120px; } .logotext{display: none;}}
@media (max-width:990px) {#hlavnimenu_03 ul li { font-size: 16px; }.w3-button{padding: 5px 10px;} 
                          .h1_lista {top:280px; width:58%;} .h1_lista h1 {font-size:150%;}
                          .h1_lista_hb {top: 205%;}}
@media (max-width:880px) {#hlavnimenu_03{text-align: center;float: none;margin-left:-20px;margin-top:0px;} 
                          #hlavnimenu_03 ul li {padding: 5px 5px; }                          
                          .logo {width: 100%; height: 150px;} .logo a img {width: 100%; height: 150px;} #navigace{display: none;} 
                          .h1_lista_el {top:10px; padding-right: 5px;} 
                          .h1_lista_el h1 {text-align: right;}
                          .h1_lista {width:50%;top:280px;}
                          .h1_lista, .h1_lista_hb {padding-left:40px;}                             
                          /*#head02.head_hb img{height:260px;}*/
                          .h1_lista_hb {top: 280px;} .h1_lista_hb h1 {padding-left:0px;}}
@media (max-width:650px) {#hlavnimenu_03{margin-right:5px;} }
@media (max-width:600px) {#hlavnimenu_03{margin-right:0px;} 
                          .h1_lista {top:260px;width:60%;} .h1_lista h1 {font-size:160%;}}

#hlavnimenu_03 ul li a:hover
{
    text-decoration: underline;
    color:#fff;
}
#hlavnimenu_03 ul li a.spodni_lista_akt 
{
    color:#fff;
}
#hlavnimenu_03 ul li.spbutton a:hover
{
    text-decoration: underline;
    color:#000;
}
#hlavnimenu_03 ul li.spbutton a.spodni_lista_akt 
{
    color:#000;
}
#hlavnimenu_03 ul li ul
{
    display:none;
    visibility:hidden;
    position:absolute;
    top:20px;
    padding-top: 15px;
    left:-40px;  
    min-width:354px;
    overflow: visible;
    z-index:500;
}
@media (min-width:700px) {#hlavnimenu_03 ul li:hover > ul,
                          #hlavnimenu_03 ul li ul:hover {
                              visibility: visible;
                              opacity: 1;
                              display: block;
                          }
}   

#hlavnimenu_03 ul li.horni_li, ul li.horni_li_akt
{
    background-color: #222;
    height:36px;
    line-height: 36px;
    width: 100%;
    border-top: solid 1px #383838;
    display: block;
    text-align: left;
    font-size: 90%;
    color: #fff;
    padding: 0px 18px;
}

#hlavnimenu_03    ul li.horni_li:hover, ul li.horni_li_akt
{
    background-color: #333;
}
#hlavnimenu_03   ul li.horni_li:hover a, ul li.horni_li_akt a
{
    text-decoration: none;
}
#hlavnimenu_03   .horni_li a
{
    width:100%;
    text-decoration: none;
}
#hlavnimenu_03 .horni_li.level3 a,  ul li.horni_li.level3:hover a,  ul li.horni_li_akt.level3 a
{
    font-size: 85%;
    padding-left: 25px;
    color: #aaa;
}
.odk_patka
{
    text-align: left;
    height: 30px;
    line-height: 30px;
    margin-top: 20px;
    background: #eee;
    padding-left: 10px;
}
.odk_patka a{
    color:#555;
    padding: 7px;
    text-decoration: none;
}
.odk_patka a:hover{
    color:#333;
    text-decoration: underline;
}

/*--------animovaná šipka-----------*/
#arrow
{
    position: relative;
    left: 50%;
    top: 520px;
  -webkit-animation-name: arrow;
  -webkit-animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: arrow;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: arrow;
  -ms-animation-duration: 2s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  animation-name: arrow;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes arrow {
  from {
    top: 510px;
  }
  to {
    top: 520px;
  }
}

@media (max-width:990px) {#arrow {top:375px;}@keyframes arrow {
  from {
    top: 360px;
  }
  to {
    top: 370px;
  }
}}
@media (max-width:730px) {#arrow {display:none;}}


/*-------------------*/