.karusel-img-1 {
  display: block;
  margin: auto;
  max-height: 38vh;
  height: 100%;
  margin-bottom: 50px;
  
}

@media (max-width: 900px) {
  .karusel-img-1 {
  display: block;
  margin: auto;
  max-height: 72vh;
  height: 100%;
  margin-bottom: 50px;
    }
}


.navbar-test {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;

  display: flex;
  justify-content: space-between;
  align-items: center;
  /* padding: 10px 30px; */
  /* padding: 10px 10px; */
  /* background-color: rgba(0, 0, 0, 0.54);  */
  /* background-image: url(../images/stekance.png); */
  /* background-size: 70%; */
  /* background-repeat: repeat-x; */
  /* Priehľadné biele pozadie */
  backdrop-filter: blur(10px);
  /* Rozmazanie pozadia */
  -webkit-backdrop-filter: blur(10px);
  /* Safari podpora */
  box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.9);
  /* Jemný tieň */
  /* border-bottom: 5px solid rgba(255, 255, 255, 0.3);  */
  /* Jemná spodná čiara */
}


/* pridavam ku original navbar s templatu */
.navbar {
    backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
}

.slider_section .container {

  max-width: 2000px !important;

}


.pod-listu-overlay {
  position: fixed;
  top: 000px;
  /* výška tvojej navbar – uprav podľa skutočnej výšky */
  width: 100%;
  height: 99px;
  /* výška obrázka štekancov */
  /* background-color: #1b5891; */
  background-color: #2a2a2a;
  background-repeat: repeat-x;
  background-size: contain;
  background-position: top;
  z-index: 899;
  /* nad hero_area, ale pod navbar */
  pointer-events: none;
  /* aby neprekážal interakciám */
  
}



.safety-stripe-top {
  width: 100%;
  height: 10px;
  /* výška pásky */
  /* top: 95px; */
  background: repeating-linear-gradient(45deg,
      #f4d600,
      /* žltá farba začína */
      #f4d600 20px,
      /* žltá končí po 20px */
      #000000 20px,
      /* čierna začína */
      #000000 40px
      /* čierna končí po 20px = 1 pás */
    );
  z-index: 1000;
  box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.9);
  /* position: relative; */
}

.safety-stripe-bottom {
  width: 100%;
  height: 10px;
  /* výška pásky */
  /* top: 95px; */
  background: repeating-linear-gradient(45deg,
      #f4d600,
      /* žltá farba začína */
      #f4d600 20px,
      /* žltá končí po 20px */
      #000000 20px,
      /* čierna začína */
      #000000 40px
      /* čierna končí po 20px = 1 pás */
    );
  z-index: 999;
  /* position: relative; */
  /* box-shadow: 15px -9px 15px rgba(0, 0, 0, 0.7); */

  margin-bottom: 60px;
}


.animation-underline {
  position: relative;
  /* Nastaví relatívne pozicovanie */
}

.animation-underline::after {
  content: '';
  /* Vytvorí nový element pod zdrojovým textom */
  font-size: 10px;
  /* Nastaví veľkosť písma (ak chcem písať text pod animovanú čiaru) */
  text-align: center;
  /* Centrovanie textu (ak chcem písať text pod animovanú čiaru) */
  position: absolute;
  /* Pozícia k rodičovskému prvku */
  width: 77%;
  /* Šírka čiary pod textom */
  transform: scaleX(0);
  /* Zabezpečuje neviditeľnosť čiary v kľudovom režime */
  height: 2px;
  /* Hrúbka čiary */
  bottom: 0px;
  /* Posunutie čiary pod text */
  left: 12%;
  /* Posunutie zľava, aby čiara bola len pod textom */
  background-color:  #c22801;;
  /* Farba čiary */
  transform-origin: bottom center;
  /* Nastaví bod transformácie na stred dolného okraja */
  transition: transform 0.25s ease-out;
  /* Plynulý prechod pre zmenu transformácie */
}

.animation-underline:hover::after {
  transform: scaleX(1);
  /* Zviditeľní čiaru pri hover */
  transform-origin: bottom center;
  /* Nastaví bod transformácie na stred dolného okraja */
}