html, body {
  margin: 0;
  padding: 0;
  font-family: Fira Sans, Verdana, Arial, sans-serif; 
  letter-spacing: -0.1px; 
}

.mezerahorni {
  padding-top: 11px;
}

 

/* Hlavní kontejner */
.main {
  display: flex; 
  flex-direction: column;   /* každý blok pod sebou = nová řádka */ 
  width: auto;               /* plná šířka na menších displejích */ 
  margin-left: 10px;
  margin-right: 10px;
}
 
  .aktualita{
    width: 100%;
  text-align: right;
  padding-top: 7px; 
  padding-right: 10px;
  font-size: 15px;
  color: #284184;
  margin-left: 10px;
  }

  .aktualita a{ 
    color: #2b3f88; 
    text-decoration: none;
    font-weight: bold;
    margin-right: 3px;
    margin-left: 3px;
    padding-right: 5px;
    padding-left: 5px;
    padding-top: 2px;
    border-radius: 5px;
     font-size: 17px;
    background-color: #eef1f9;
  } 

  .aktualita a:hover{ 
    text-decoration: underline;
  }    

/* Na velkých obrazovkách */ 
@media (min-width: 1010px) { 
  .main {
    width: 1000px; /* například fixní šířka */ 
    margin: 0 auto; /* horizontální centrování (zleva/zprava) */  
  } 

  .aktualita { 
    text-align: right; 
    padding-top: 7px; 
    font-size: 15px; 
    color: #284184; 
  } 
  .aktualita a { 
    color: #2b3f88; 
    text-decoration: none; 
    font-weight: bold; 
    margin-right: 3px; 
    margin-left: 3px; 
    padding-right: 3px; 
    padding-left: 3px; 
    padding-top: 2px; 
    border-radius: 5px; 
    background-color: #fff; 
    font-weight: 900; 
  } 
}

/* logo blok */
.logo {
  width: 100%;
  text-align: center;     /* centrování inline/inline-block prvků */
  box-sizing: border-box; 
}

/* základ – menší zařízení */
h1 { 
    display: inline-block; 
    margin: 0;  
  margin: 0;
  float: none; 
  font-size: 36px;
  margin-bottom: -6px;
}

h1 a {
  display: block;
  width: 210px;
  height: 65px;
  margin: 15px 0 0 0;     
  color: #244282;
  text-decoration: none;
  transition: transform .15s ease;        /* plynulý pohyb */
}

.center{
  text-align: center;
  color: #284184;
}

.radekflex {
  display: flex;
}

.h2konec {   

  flex: 0 0 auto;  /* drží se podle obsahu/šířky 282px */
  width: 282px;
  text-align: center;
  top: -6px;
  position: relative;
}

.konecpred{
  flex: 1 1 auto; 
  width: auto;
  background: url(../img/bck.png) repeat-x; 
}

.konecza{ 
    flex: 0 0 20px;  /* přesně 20px, ať se nepřepočítává */
    background: url(../img/bck.png) repeat-x;   
}


@media (max-width: 1199.99px) {

  .h2male {  
    position: relative;
    text-align: center;     /* centrování inline/inline-block prvků */
    box-sizing: border-box; 
    top: -18px;
  }

  .h2 {
    display: none !important;
  }

  .prvni a{
    font-size: 12px;
  }

  .info {
    display: none !important;
  }

  .zprava {
    border-radius: 5px;
  }

}

/* první blok – pevná šířka */


.casskryvany {
  font-weight: 500;
} 

@media (min-width: 1200px) {

  .casskryvany {
    display: none !important;
  }
  
  .radek {
    display: flex;            /* zapne flexbox */
    align-items: center;      /* svislé zarovnání (text na střed) */
    width: 100%; 
  }

  .pred {
    width: 20px; 
    background: url(../img/bck.png) repeat-x;
    height: 34px;
  }


  /* třetí blok – vyplní zbytek prostoru */
  .za {
    flex: 1;                  /* magická hodnota: zabírá zbytek místa */
    background: #cdd6f5;      /* pro ukázku */
    background: url(../img/bck.png) repeat-x;
    height: 34px;
  }

  .h2 {
    flex: 0 0 auto;           /* nezvětšuje se, jen podle textu */
    font-weight: 600;
    color: #244282;
    padding: 0 5px;
    font-size: 16px;
  }  

  .h2male {
    display: none !important;
  }

  h1 {

  text-indent: -9999px; 
  }

}

/* prostřední blok – text */


h2 {
  margin-top: 5px;
}

h2, h2 a{
  font-size: 16px;
  color: #244282;
  text-decoration: none;
}





/* velká obrazovka */
@media (min-width: 1200px) {
  .main {
    width: 1000px;
    margin: 0 auto;
  }

  .logo { 
  width: 100%;
  text-align: left;
  box-sizing: border-box;
  padding-left: 16px;  /* můžeš dát např. 20px, pokud chceš odsazení */
  }

  h1 a {
    width: 375px;
    height: 104px;
    margin: 19px 0 0px 0;                 /* vlevo, žádné centerování */
    background: url("../img/logonew.png") no-repeat left center / contain; /* vlevo */
  }

  /* při hoveru stále „pokles“ o 2px */
  h1 a:hover {
    transform: translateY(2px);
  }
     /* najetí myší – posun o 2px dolů (pokles) */
  h1 a:hover {
    transform: translateY(2px);
  }
}

.radek-pravy {
  display: flex;
  justify-content: flex-end;     /* obsah vpravo */
  align-items: center;           /* svisle na střed */
  width: 100%; 
  height: 28px;                  /* výška pruhu */
  box-sizing: border-box;
  padding-right: 15px;           /* odsazení od pravého okraje */
  font-size: 14px;
}

/* text/odkaz vpravo */
.prvni a {
  background-color: #fef78f;     /* světle žlutý podklad */
  color: #ec1e35;                /* červený text */
  text-decoration: none;
  font-weight: bold;
  padding: 6px 7px 3px 9px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px; 
}
 

/* hlavní kontejner */
.zprava {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  padding-top: 3px;
  background-color: #eef1f9;
  margin-bottom: 4px;
}

/* vpravo – sloupec s informacemi */
.info {
  width: 100px;
  text-align: right;
  line-height: 1.4;
  box-sizing: border-box;
  font-size: 22px;
  text-align: center;
  color: #352c2c;
  padding-top: 6px;
}

/* vlevo – textová část */
.obsah {
  flex: 1; /* vyplní zbytek šířky */
  padding-right: 15px;
  padding-left: 15px;
  box-sizing: border-box;   
  font-family: Fira Sans, Verdana, Arial CE, Arial, Helvetica, sans-seriff;
  padding-bottom: 2px;
}

/* nadpis článku */
.obsah h3 {
    font-size: 26px;

    font-weight: bold;
    letter-spacing: -0.1px;
    line-height: 33px;
    padding-top: 7px;
    text-decoration: underline;
    
  color: #B61111;
  margin-top: 0px;    
  margin-bottom: 8px;
}

/* nadpis článku */
.obsah h4 {
  color: #244282;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: -0.1px;
  line-height: 33px;
  padding-top: 5px;
  text-decoration: underline;
  margin-top: 0px;
  margin-bottom: 7px;
  padding-left: 1px; 
}

.obsah h3 a{   
text-decoration : underline; 
  color: #B61111;
}

.obsah h4 a{   
text-decoration : underline; 
  color: #244282;
}

.obsah h4 a:hover, .obsah h3 a:hover{   
text-decoration : underline; 
  color: #e62a2a;
}

/* obrázek, který obtéká text zprava */
.obsah .foto {
  float: left;
  width: 208px;               /* šířka obrázku */
  height: 117px;
  margin-right: 11px;
  margin-bottom: 7px;
  border-radius: 6px;
}

/* běžný text článku */
.text {
    text-align: justify;
    display: block;
    font-size: 16px;
    padding-top: 0px;
    padding-right: 15px;
    margin-top: -2px;
    color: #000;
    padding-bottom: 6px;
}

.text a {
  text-decoration: underline;
  color: #244282;
  font-weight: 500;
}

.text a:hover {
  text-decoration: underline;
  color: #e62a2a;
}
  
/* OBRÁZEK vlevo, text ho obtéká i POD ním */
.obrazekatext .obrazek {
  float: left;
  width: 208px;
  margin: -1px 14px -3px 3px;  /* mezery kolem obrázku */
}

.obrazekatext .obrazek img {
  display: block;
  border-radius: 6px;
  width: 208px;
  height: 117px;
  margin-top: 4px;
}

 
/* responsivní – na menších obrazovkách pod sebou */
@media (max-width: 768px) {

  .obrazekatext .obrazek img { 
    width: 187px;
    height: 105px; 
  }

  .obsah h3 {
    font-size: 22px;
  }

  .obsah h4 {
    font-size: 20px;
    letter-spacing: -0.2px;
    line-height: 26px;
  }

  .obrazekatext .obrazek { 
    width: 187px;
    margin: 3px 16px 0px 1px;
  }


  .obsah {
    padding-right: 11px;
  }  

  .text {
    padding-right: 6px;
  }

} 

.cas {
  padding-bottom: 4px;
  padding-bottom: 4px;
}

.cervenyradek {
  display: flex;
  align-items: center; /* vertikální zarovnání (volitelné) */
}

.zasipky {

  width: 100px;

  }

.cervenesipky {
  width: 31px;
  background: url(../img/down.png);
    background-repeat: repeat;
    background-origin: padding-box;
  padding-bottom: 5px;
  background-repeat: no-repeat;
  background-origin: content-box, padding-box;
  height: 28px;
}

.cervenytext {
  flex: 1; /* roztáhne se na zbytek místa */
    font-family: Fira Sans, Verdana, Arial, sans-serif;
    width: 500px;
    text-align: center;
    color: red;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-right: 8px;
}

.malycervenytext {
  display: none;
}


@media (max-width: 1200px) {

  .zasipky {
      width: 30px;
   
    }

  .cervenytext {
     flex: none;    
     display: none !important;
    }

 .malycervenytext {
    display: block;
    flex: 1;
    text-align: center;
    align-items: center;
    font-family: Fira Sans, Verdana, Arial, sans-serif; 
    color: red;
  }


}
 


*, *::before, *::after { box-sizing: border-box; }

.zprava, .radekflex, .obsah { min-width: 0; }
.obsah, .text, .obsah h3, .obsah h4 {
  overflow-wrap: anywhere;
  word-break: break-word;
} 

img, video, iframe { max-width: 100%; height: auto; }