/*
    Nastavenie CSS style pre novu stranku inprov.sk
    Farby pouzite podla povodnej redlohy, obrazky budu 
    priebezne inovovane.
*/

html {
    display: flex;
    flex-flow: row nowrap;  
    justify-content: center;
    align-content: center;
    align-items: center;
    /* height:100%; */
    margin: 0;
    padding: 0;
}

/* nastavenie pozadia a centrovania pre telo stranky */
body {
    background-color: rgb(228, 233, 235);
    align-self: center;
    max-width: 900px;
    margin: 0 auto;
    width: 80%;
}

/* nastavenie stylu navigacneho menu na stranke */
nav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
}

.bg-image {
  /* blur effect */
  filter: blur(8px);
  -webkit-filter: blur(8px);
  
  /* full height */
  height: 100%; 
  
  /* pozadie stranky */
  background: url(../images/backgroundBlur02.png);

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* farebne nastavenie a centrovanie hlavicky */
header {
    clear: both;
    width: 100%;
    text-align: center;
    background-color: rgb(57, 186, 232);
}

/* jednoduche nastavenie pre main */
main {
    width: 100%;
    float: left;
    text-align: center;
}

/* nastavenie stylu h1, farba, pismo ... */
h1 {
  text-align: center;
  hyphens: auto;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background-color: rgb(57, 186, 232);
  /* color: rgb(99, 14, 99); */
  color: white;
}

/* styl hlavneho nadpisu na uvodnej stranke */
#hlavnyNadpis{
  font-size: 32pt;
  font-family: 'Times New Roman', Times, serif;
  color: white;
}

h2 {
  text-align: center;
  clear: both;
  width: 100%;
  color: rgb(57, 186, 232);
  font-style: italic;
}

h3 {
  clear: both;
  width: 100%;
  text-align: left;
  color: rgb(57, 186, 232);
}

.centerIMG {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 600px;
}

.centerIMG2 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  align-items: center;
}

/* nastavenie oramovania */
.ramovanie {
  border: 1px solid rgb(57, 186, 232);
}

mysection01 {
    display: flex;
    justify-content: center;
  }
  
footer {
    clear: both;
    width: 100%;
    text-align: center;
    background-color: rgb(27, 12, 0);
    padding: 5px;
}

img {
    max-width: 100%;
    height: auto;
    width: auto;
    display: flex;
    flex-wrap: wrap-reverse;
  }

.imgZoznam {
  width: 20px;
  height: 20px;
}

 /* zvacsenie obrazkov */
 .zoomovanie{
  display: block;
  margin-left: auto;
  margin-right: auto;
  transition: transform .2s; 
}

.zoomovanie:hover{
  transform: scale(1.5);
}

/* zaoblenie okrajov obrazkov, map a videa */
.zaoblovacka {
  border-radius: 20px;
}

.stredatorL {
  text-align: left;
}

.ramovkaMapy {
  height: 450px;
  border: 0;
  width: 100%;
}

.logoHlavnaStranka {
  width: 18px;
}

.spanRed {
  color: red;
}

  ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
  }
  
  li {
    float: left;
  }
  
  li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
  }
  
  li a:hover:not(.active) {
    background-color: #111;
  }
  
  .liObyc {
    float: none;
    display: list-item;
    text-align: left;
    /* mask-image: url(../images/maser01.png); */
  }

  .ulObyc {
    list-style-type: square;
    margin: auto;
    /* padding: 0%; */
    overflow: auto;
    background-color: rgb(228, 233, 235);
  }

  .active {
    background-color: rgb(57, 186, 232);
  }

  .textRedUl {
    text-decoration-line: underline;
    color: red;
  }

  .textBlueSt {
    font-weight: bold;
    color: rgb(57, 186, 232);
  }

  .footer {
    background-color: rgb(57, 186, 232) ;
    color: #fff;
}

table {
    border-collapse: collapse;
    width: 100%;
  }
  
  th, td {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #ddd;
  }
  
  tr:hover {background-color: coral;
}

.klikatkoLogo {
  max-width: 10%;
  height: auto;
}

.footer-copyright-text {
    color: #fff;
      font-size: 13px;
      font-weight: 400;
      line-height: 18px;
      margin-bottom: 0;
      margin-top: 0;
  }
.footer-copyright-link {
    color: #fff;
    text-decoration: none;
}