@media only screen and (max-width: 1300px ){
  .nav{
      position: fixed;
      top: 5.98em;
      left: 0px;
      background-color: #1e1e1efe;
      width: 18.75em;
      height: 100vh;
      padding: 0.625em 0 1.5625em;
      transform: translateX(-100%);
      transition: all 0.3s ease-in-out;
  }

  .nav_list{
      flex-direction: column;
      align-items: center;
      row-gap: 50px;
      padding-top: 10vh;
  }

  .nav_link{
      color: #ffffffca;
      font-size: 1.1em;
  }

  .nav_link::after {
      display: none;
  }

  .nav_link:hover,
  .nav_link:active{
      color: #fff;
  }

  .hamburger{
    display: block;
  }

  .header_content {
    padding: 1.875em 0.9375em;
  }

  .grid-hero{
    padding-left: 0.9375em;
  }

  .section-four-text{
    width: 95%;
  }

}




@media only screen and (max-width: 1200px ){
    .slider{
      display: none;
    }

    .grid-hero{
      display: flex;
      justify-content: center;
    }

    .grid-hero{
      padding-left: 0em;
    }
  
  
    .nastav {
      align-items: center;
      padding-top: 6.875em;
      padding-bottom: 6.25em;
      cursor: default;
      padding-left: 15px;
    }

    .obrazok img{
      max-width: 22em;
    }
  
    .riadok{
      gap: 0em;
    }
  
    .riadok p{
      font-size: 0.9em;
    }
  
    .udaje {
      width: 26em;
      height: fit-content;
      padding: 0 0.9375em;
    }

    .menu {
      width: 15em;
      height: fit-content;
      padding: 0 0.9375em;
    }

    .kontakt {
      width: 17em;
      height: fit-content;
      padding: 0 0.9375em;
  }

}




@media only screen and (max-width: 1000px ){
  .section-two-gallery{
    display:none ;
  }

  .slider-two-container{
    display: block;
  }
}



@media only screen and (max-width: 900px ){

  .section-four-text{
    align-items: center;
  }

  .riadok {
    grid-template-columns: 1fr; /* 1 stĺpec */
    max-width: 80%;
    text-align: center; /* Zarovnanie textu na stred */
  }

  .riadok p{
    padding-top: 1.25em;
  }

  .obrazok{
    padding-top: 0.9375em;
  }

  .obrazok img {
    max-width: 80%; 
  }
  .nastav{
    padding: 2.875em 0em 3.575em 0.9375em;
  }

  #footer-nadpis{
    font-size: 1.3em;
    margin-bottom: 0.3em;
  }

  footer ul{
    line-height: 2.725em;
  }

  footer ul li{
    font-size: 1.1em;
  }

  .udaje {
    width: 18em;
    height: fit-content;
    padding: 0 0.9375em;
  }

  .menu {
    width: 13em;
    height: fit-content;
    padding: 0 0.9375em;
  }

  .kontakt {
    width: 15em;
    height: fit-content;
    padding: 0 0.9375em;
  }

  .prava p{
    font-size: 0.9em;
  }
}


@media only screen and (max-width: 720px ){

  .parallax {
    background-attachment: scroll;
  }
  
  .nastav{
    padding: 1.875em 0em 1.875em 0.9375em;
  }

  .menu{
    display: none;
  }

  .setgrid ul{
    padding-bottom: 2.5625em;
  }

  .prava p{
    font-size: 0.7em;
  }
}





@media only screen and (max-width: 650px ){

  .logo::after {
    content: "";
    display: none;
    width: 98%;
    border-bottom: 0.0625em solid #cccccc;
    margin: 0px auto;
  }

  .nav{
    top: 5.45em;
  }
  .section-hero-text h1{
    margin-bottom: 0.85em;
  }

  .section-hero-text p{
    font-size: 1em;
  }

  #cennik {
    margin-top: 2em;
    font-size: 0.7em;
    word-spacing: 0.225em;
    line-height: 1.475em;
    letter-spacing: 0.06em;
  }

  .logo{
    font-size: 1.3em;
  }
}







@media only screen and (max-width: 550px ){
  .nav{
    width: 100%;
  }

  .left-text{
    align-items: center;
    text-align: center;
    padding: 0 1.5625em;
  }

  .br-hide{
    display:block;
  }

  .container{
    padding: 8em 8%;
  }
}







@media only screen and (max-width: 520px ){
  .parallax{
    height: 100vh;
  }

  .section-hero-text h1{
    font-size: 1.6em;
  }

  .grid-hero{
    height: 31em;
  }

  .setgrid{
    display: flex;
    flex-direction: column;
  }

  .obrazok img{
    max-width: 93%;
  }

  .udaje{
    width: 20em;
  }

  .kontakt{
    width: 20em;
  }
}



@media (orientation: landscape){
  @media only screen and (max-height: 500px ){
    .section-hero-text {
      position: absolute;
      top: 58%;
  }

    .parallax{
      height: 130vh;
    }
}

@media only screen and (max-height: 450px ){
  .section-hero-text {
    position: absolute;
    top: 58%;
}

  .parallax{
    height: 140vh;
  }
}


@media only screen and (max-height: 450px ){
  .section-hero-text {
    position: absolute;
    top: 58%;
}

  .parallax{
    height: 160vh;
  }
}

}